Mailing-List: contact users-help@flex.apache.org; run by ezmlm
Precedence: bulk
Reply-To: users@flex.apache.org
MIME-Version: 1.0
In-Reply-To: <66D7F0A8-89EC-4EDE-AE76-87D30BF8695E@gmail.com>
References: <1463126705918-12682.post@n4.nabble.com> <1463126943031-12683.post@n4.nabble.com>
 <1463141477789-12684.post@n4.nabble.com> <0E867A21-42D7-4C0B-AC09-D2E09C81C61E@gmail.com>
 <1463144032459-12686.post@n4.nabble.com> <66D7F0A8-89EC-4EDE-AE76-87D30BF8695E@gmail.com>
From: jude <flexcapacitor@gmail.com>
Date: Fri, 13 May 2016 08:59:10 -0500
Message-ID: <CANcBHEBDKjsu7GdJ5+wsmR7WzLKLfYE52w=c1Lahkj6VL7jLHQ@mail.gmail.com>
Subject: Re: [FlexJS] How to create a <div> with a shadow style
To: "users@flex.apache.org" <users@flex.apache.org>
Content-Type: multipart/alternative; boundary=94eb2c047d7892edd60532b9af86
archived-at: Fri, 13 May 2016 13:59:45 -0000

--94eb2c047d7892edd60532b9af86
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: quoted-printable

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=3D"Hello World" x=3D"100" y=3D"100"
className=3D"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+F=
lash+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=E2=80=99s try like this:
>
> If you want to use the FlexJS wrappers, you could do something like this
> (from that example):
>
> <js:Container id=3D"mapCanvas" height=3D"35%" className=3D"homeMap">
>     <js:style>
>         <js:SimpleCSSStyles left=3D"0" right=3D"10" top=3D"10" />
>     </js:style>
>         <js:Image id=3D"mapImage" width=3D"487" height=3D"100%" alpha=3D"=
1.0"
> style=3D"left:10;top:10"/>
>         <js:Label y=3D"110" text=3D"US Developers . Flex . FlexJS" width=
=3D"95%"
> height=3D"40"
> style=3D"margin:auto;fontWeight:'bold';fontSize:22;color:#ffffff;fontFami=
ly:'Arial';textAlign:'center'"/>
>         <js:Label text=3D"Learn More &gt;&gt;" width=3D"95"
> style=3D"fontSize:12;fontFamily:'Arial';bottom:10;right:10"/>
>         <js:Label text=3D"$60/hr"
> style=3D"color:#ffffff;fontWeight:'bold';fontFamily:'Arial';fontSize:20;r=
ight:10:top:10"/>
>         <js:Label text=3D"Rates as low as" x=3D"551" y=3D"16"
> style=3D"fontSize:12"/>
> </js:Container>
>
> Notice the style declaration inside the =E2=80=9CContainer=E2=80=9D 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 specifi=
ed
> 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 particularl=
y
> >> good one for seeing how to build an app.
> >
> > I honestly already browsed through the FlexJSStore example but can't fi=
nd
> > 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.
>
>

--94eb2c047d7892edd60532b9af86--