flex-users mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From jude <flexcapaci...@gmail.com>
Subject Re: [FlexJS] How to create a <div> with a shadow style
Date Fri, 13 May 2016 13:59:10 GMT
You should be able to set the style property inline but I had an error with
the original CSS. The same CSS works as a style declaration. It might be
the dashes in the string. You should be able to set the className to a
style that has those values defined.

    <fx:Style>
        @namespace basic "library://ns.apache.org/flexjs/basic";

        .labelStyles {
            background-color: blue;
            box-shadow: 5px 5px 5px #888;
        }

    </fx:Style>

    <!-- Initial View -->
    <js:initialView>

        <js:ViewBase>
            <js:Container>
                <js:Label text="Hello World" x="100" y="100"
className="labelStyles"/>
            </js:Container>
        </js:ViewBase>

    </js:initialView>

Here is a link
<https://gist.github.com/monkeypunch3/24d23418258c985263022fd6b5ddc32d> to
the above code in a basic example.

I updated the getting started guide
<https://cwiki.apache.org/confluence/display/FLEX/Using+FlexJS+with+Adobe+Flash+Builder>
for FB that includes a way to launch the debug version of the JS output. If
you have Firebug it opens it with the path to the error.


On Fri, May 13, 2016 at 8:52 AM, Harbs <harbs.lists@gmail.com> wrote:

> Let’s try like this:
>
> If you want to use the FlexJS wrappers, you could do something like this
> (from that example):
>
> <js:Container id="mapCanvas" height="35%" className="homeMap">
>     <js:style>
>         <js:SimpleCSSStyles left="0" right="10" top="10" />
>     </js:style>
>         <js:Image id="mapImage" width="487" height="100%" alpha="1.0"
> style="left:10;top:10"/>
>         <js:Label y="110" text="US Developers . Flex . FlexJS" width="95%"
> height="40"
> style="margin:auto;fontWeight:'bold';fontSize:22;color:#ffffff;fontFamily:'Arial';textAlign:'center'"/>
>         <js:Label text="Learn More &gt;&gt;" width="95"
> style="fontSize:12;fontFamily:'Arial';bottom:10;right:10"/>
>         <js:Label text="$60/hr"
> style="color:#ffffff;fontWeight:'bold';fontFamily:'Arial';fontSize:20;right:10:top:10"/>
>         <js:Label text="Rates as low as" x="551" y="16"
> style="fontSize:12"/>
> </js:Container>
>
> Notice the style declaration inside the “Container” tag. Container is a
> wrapper around div. You can specify the CSS style properties using the
> SimpleCSSStyles declaration. Class names and inline styles can be specified
> as well as can be seen in the above code.
>
> Note: When the app is compiled to JS, any UIBase object (including
> Container) returns the underlying DOM element when accessing
> wrapper.element. Once you have a reference to the DOM element, it can be
> manipulated like any DOM element in JS.
> You can create the DOM objects directly if you want as well.
>
> Does this help?
> Harbs
>
> On May 13, 2016, at 3:53 PM, OK <OKrueger@edscha.com> wrote:
>
> > Harbs wrote
> >> Take a look at the example projects. The FlexJS Store is a particularly
> >> good one for seeing how to build an app.
> >
> > I honestly already browsed through the FlexJSStore example but can't find
> > anything related to my question.
> > Maybe I'm blind... perhaps you could give me a hint?
> >
> > Thanks,
> > Olaf
> >
> >
> >
> >
> > --
> > View this message in context:
> http://apache-flex-users.2333346.n4.nabble.com/FlexJS-How-to-create-a-div-with-a-shadow-style-tp12682p12686.html
> > Sent from the Apache Flex Users mailing list archive at Nabble.com.
>
>

Mime
  • Unnamed multipart/alternative (inline, None, 0 bytes)
View raw message