Hi again :),

I still didn't see the code, but was imagining how I'd like to use this
feature.

Some thoughts:

1.- Could be possible to have it as a bead for UIBase components a side of
the UIGraphicBase that could still be convenient for some cases?

<j:Button>
    <j:beads>
       <js:MyGraphics> <-- This could be a custom bead with the graphics
code and the drawings can be created in a element created by a base bead
(Maybe IGraphicsBead? and a GraphicsBead)
   </j:beads>
</j:Button>

2.- Could be possible even declare graphics instructions in MXML?
Inside a js:GraphicsBead tag add things like:

<js:BeginFill color=""/>
<js:DrawRectangle x="0" y="0" w="100" h="100"/>
<js:EndFill/>

(don't know right now if this could not be optimal, or maybe will require
compiler optimization to remove all the extra code and translate to simple
SWF/ SVG instructions)

I thinking looking at the code of your example will help to imagine how all
this could be modeled/applied

thanks

Carlos




El mar., 28 ene. 2020 a las 9:44, Carlos Rovira (<carlosrov...@apache.org>)
escribió:

> Hi Greg,
>
> very cool! :)
> Hope to play with it very soon :)
>
> Do you plan to add your "graphics browser example" to examples?
>
> Thanks for working on this! :)
>
> Carlos
>
> El mar., 28 ene. 2020 a las 3:28, Greg Dove (<greg.d...@gmail.com>)
> escribió:
>
>> FYI, I just pushed the WIP on that.
>>
>> to use it in code, there is a UIGraphicsBase target.
>> I'm still not happy with that, so it could change over time. At the moment
>> the svg 'child' in javascript that is used as the 'rendered output'
>> participates in the child element count for that class. Ideally it should
>> not do that and should always be behind the children. Obviously there are
>> different ways to make that work including adding a separate 'children'
>> div
>> container, but I wanted to see if there was a way to keep the native
>> implementation as siblings but avoid the '0' indexed svg element from
>> showing up in the normal api for child elements.
>>
>> Anyhow, a simple way to start working with this is as follows:
>>
>> Assuming you have the following in mxml;
>>
>> <js:UIGraphicsBase localId="jsGraphicsTarget" x="100" y="100"/>
>>
>> then you could do the following somewhere inside a script block:
>> (assuming: import org.apache.royale.display.Graphics; )
>>
>> var graphics:Graphics = Graphics.getInstanceFor(jsGraphicsTarget);
>> {now use 'graphics' similar to how you would for swf here}
>>
>>
>> On Tue, Jan 21, 2020 at 8:18 AM Greg Dove <greg.d...@gmail.com> wrote:
>>
>> > Thanks for checking that, Carlos. I think it should be quick to add this
>> > to Royale after I am back from vacation.
>> >
>> >
>> >
>> > On Mon, 20 Jan 2020, 01:21 Carlos Rovira, <carlosrov...@apache.org>
>> wrote:
>> >
>> >> Hi Greg,
>> >>
>> >> awesome work! Hope you can get ANT working soon. Although I think is
>> not
>> >> required and you can get to that at a later time when you have the
>> time. I
>> >> think the most important thing is not break maven/ant builds and not
>> >> affect
>> >> current code. Saving that, I think is safe to commit the work, and
>> then go
>> >> incremental from that point. I use to work in that way. If something
>> can
>> >> break build or running code, so it can be ensure integrity in one
>> commit,
>> >> then is better to work in a branch and merge as soon as you get the
>> safe
>> >> state.
>> >>
>> >> Thanks for working on that. it will make Royale even more interesting.
>> I
>> >> think it could be great to use in Jewel for some graphic improvements
>> :)
>> >>
>> >> Looking at the example, I went through all and see all working good or
>> >> with
>> >> the issues already mentioned in the text part (Mitter, Bitmap repeat
>> >> Error,...). Is curious to see that lines and curves seems to render
>> better
>> >> now in browsers than in Flash Player where still lacks of some weird
>> >> representations when going from rect to curve.
>> >>
>> >> We'll be showing this as soon as you commit to develop in social
>> networks.
>> >> I think this can be of interest  for many people out there that can see
>> >> Royale reaching new and important capabilities.
>> >>
>> >> Congrats for what you have achieved here!! Is awesome! :)
>> >>
>> >>
>> >>
>> >> El dom., 19 ene. 2020 a las 4:01, Greg Dove (<greg.d...@gmail.com>)
>> >> escribió:
>> >>
>> >> > Just quickly, to add to the list at the bottom of the last email....
>> >> > another thing you can do is download the rendered svg.
>> >> > It should open in Inkscape or Illustrator. I have been mainly using
>> >> > Inkscape to check that, I think it is more accurate in terms of
>> >> conforming
>> >> > with svg spec.
>> >> >
>> >> >
>> >> > On Sun, Jan 19, 2020 at 3:41 PM Greg Dove <greg.d...@gmail.com>
>> wrote:
>> >> >
>> >> > >
>> >> > > Just a quick update on where I am at with the above.
>> >> > > I was hoping to get the the current code for this in before I go on
>> >> > > vacation for the next week, but I won't be able to do that (I need
>> to
>> >> > work
>> >> > > through the build side of things, I have only got maven working so
>> >> far).
>> >> > >
>> >> > > I have been focused recently on BitmapData support and have what I
>> >> think
>> >> > > is an adequate starting point for this.
>> >> > > it is really only supporting setPixel, setPixel32, fillRect, lock,
>> >> > unlock,
>> >> > > dispose. I did add a couple of other methods, but have not really
>> >> started
>> >> > > to test those yet.
>> >> > >
>> >> > > If you are interested you can test this and let me know of any
>> issues
>> >> you
>> >> > > see. I have a series of test suites in a live testing app I have
>> been
>> >> > using.
>> >> > > (This is really meant for desktop use, but does actually show
>> >> something
>> >> > on
>> >> > > a large screen tablet).
>> >> > >
>> >> > > Here is a direct link into one of the bitmap based tests:
>> >> > >
>> >> >
>> >>
>> http://interactionscript.com/royale/swf-graphics/index.html?defaultTest=4,1
>> >> > > See instructions at the end of this email if you want more info
>> about
>> >> > what
>> >> > > you can do.
>> >> > >
>> >> > > This is working with beginBitmapFill, and lineBitmapStyle. Smooth
>> vs.
>> >> > > non-smooth works on quite a few browsers, but not all browsers
>> seem to
>> >> > > support the non-smoothing (i.e. 'non-alias' or 'crisp' scaling)
>> >> option.
>> >> > > Repeat vs. non-repeat needs more work to get it to match because of
>> >> the
>> >> > > way that patterns work in svg vs. how this works in flash.
>> >> > > I hope it will be possible using a feConvolveMatrix filter and a
>> >> > > 'duplicate' option for 'edgeMode', but I only started looking into
>> >> that
>> >> > > today and need to stop for now.
>> >> > >
>> >> > > Browsers: So far I think the most problematic browser seems to be
>> >> desktop
>> >> > > Safari, although IE11 is not great for some gradients.
>> >> > > Things seem to work ok also on mobile tablets I tested on (old iPad
>> >> and a
>> >> > > 6 year old Samsung Tablet with Chrome 59.x).
>> >> > >
>> >> > >
>> >> > > What can you do with the testing app?
>> >> > > It's really only to verify what works and what doesn't across
>> >> browsers.
>> >> > > But it would be great - if you have some time to play with it  - if
>> >> you
>> >> > > could check to see if there are any glaring issues that I have not
>> yet
>> >> > > encountered, and let me know.
>> >> > > Here are some things you can do:
>> >> > > 1. You can look at all the tests and compare them visually
>> >> side-by-side
>> >> > > between html5 and Flash.
>> >> > > 2. if you see bitmapData referenced as a variable in the code
>> display
>> >> on
>> >> > > the main screen, you can do things with it. For example, in the
>> link
>> >> > above
>> >> > > it shows 'bitmapData0' being referenced as a var. In that case if
>> you
>> >> > typed
>> >> > > 'bitmapData0.dispose()' in the javascript console, it will run that
>> >> code
>> >> > in
>> >> > > both javascript and flash, you will see the drawn content that used
>> >> that
>> >> > > bitmapdata as a fill or stroke suddenly 'unpaint' itself visually.
>> You
>> >> > > could also use fillRect, and setPixel etc to run that code in both
>> >> > > javascript and flash. Note that BitmapData api is not yet fleshed
>> out
>> >> > very
>> >> > > much at all.
>> >> > > 3. You can (at least on Chome and some other browsers) send the
>> >> currently
>> >> > > executed code to the javascript console. You can then copy, paste,
>> and
>> >> > > change some values before pressing enter to execute the same code
>> with
>> >> > > different settings. It will then run that code in both javascript
>> and
>> >> > > flash.
>> >> > > 3. You can open the javascript console and do a bunch of arbitrary
>> >> stuff.
>> >> > > When you are doing that, simply imagine you already have imports
>> for
>> >> > > Matrix, BitmapData, Rectangle, and that you can simple type
>> >> > > 'graphics.{myGraphicsMethodHere}' for the target graphics context.
>> >> > >
>> >> >
>> >>
>> >>
>> >> --
>> >> Carlos Rovira
>> >> http://about.me/carlosrovira
>> >>
>> >
>>
>
>
> --
> Carlos Rovira
> http://about.me/carlosrovira
>
>

-- 
Carlos Rovira
http://about.me/carlosrovira

Reply via email to