On 10/3/16, 2:56 PM, "carlos.rov...@gmail.com on behalf of Carlos Rovira" <carlos.rov...@gmail.com on behalf of carlosrov...@apache.org> wrote:
>Hi, > >now that I have a maven env and the NextGenAS with Visual Studio Code >setup, I'm finding super easy to test and modify things in FlexJS, and I'm >trying to learn what folks made. I think one of the points that we need >soon, is to get some good-looking examples, for this reason, I want to >check styling in flexjs and see what can be done in the current state of >the art. For example: > >1.- I would want to exercise a way to make some of the examples look more >beautiful. For example, applying MDL >But how where I should aggregate css mdl url files? The index.html is >generated when compiling...how could I insert, i.e.: mdl ? : > ><link rel="stylesheet" >href="https://fonts.googleapis.com/icon?family=Material+Icons";><link >rel="stylesheet" >href="https://code.getmdl.io/1.2.1/material.indigo-pink.min.css";><script >defer src="https://code.getmdl.io/1.2.1/material.min.js";></script> > > >Should I insert a fx:style block in the main js:Application ? (if >so...how?) > >...and how to apply some styling to a component? some example out there to >check? > >Is out there some link where I could read about CSS in FlexJS and what >properties are available per component? There isn't a wiki page on this yet. The nightly builds should now support an -html-template option where you can specify your own file. There should be a templates/js-index-template.html in the build (or at least, in the flex-asjs repo) to serve as a starting point. There you can add other css files. It is up to the View of each component to respond to any CSS. On the SWF side, we don't have sophisticated CSS handling so most complex things will fail to have any effect. On the JS side, if you can use the existing components to construct the DOM, the CSS should behave properly. These CSS files are not presented to the MXMLC/MXMLJSC compilers. FlexJS CSS is full of non-compliant CSS that specifies ClassReferences. When you specify CSS files and/or fx:Styles to MXMLC/MXMJSC or they are found in a SWC, a data structure is created from the CSS so SWF-side code doesn't have to parse CSS at runtime. SWF-side code tries to use that data structure to emulate CSS in Flash. SimpleCSSValuesImpl doesn't handle any complex selectors right now. I hope we eventually have a fully compliant AdvancedCSSValuesImpl. MXMLJSC outputs the CSS files it found as the .css file for the app, but it clears out non-compliant CSS like those ClassReferences that would make the browser complain. JS code also gets the same data structure as the SWF-side code so the JS version of the components can pick up class references. >(right now I'm trying to use a >s:Button, Spark components are not supported at this time. > >and...what about js:Button...I don't see is used...instead, theres's >svg:TextButton... someone could talk a bit about svg components in FlexJS >so I could understand the scope of the namespace and where to use it? js:Button doesn't support text labels. js:TextButton does. That's why you don't see js:Button in the examples, but it is used as the base for uparrow/downarrows in Spinners and a few other places. There is a plan to use FXG/SVG for a skinning model. I haven't played with it myself so I don't know what state it is in. > >A side from this, I think it could be good to make something similar to >blog.flexexamples.com for flexjs, I think I could try something about this >as I get more skilled on the possiblities. I'd rather start a tour-de-flexjs. HTH, -Alex
