Feb
13

By

Flex 4 – cut/Copy/Paste context menus not appearing

Category: Flex, ProgrammingTags: , , , 1 Comment

The right-click context menu for s:TextArea s:RichTextEditor, s:TextEdit, etc. is an expected feature for any sort of form functionality however a bug in s:Panel breaks this functionality whenever the control is inside an s:Panel item.

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
...
    <!-- right-clicking this will show a context with cut/copy/paste -->
    <s:TextArea text="text in app" />
    <!-- right-clicking this will NOT show a context with cut/copy/paste -->
    <s:Panel>
        <s:TextArea text="text in panel" />
    </s:Panel>
...
</application>

Note that this doesn’t affect ctrl+v/p/x keybindings – they work regardless.

There is a hack to get around this –  mark both the s:panel as well as it’s skin as mouseEnabled=”true”. What that means is that EVERY spark panel needs to have a custom skin with that override. This includes cases where there are two enclosing panels.

<!-- this won't work -->
<s:Panel>
    <s:Panel mouseEnabled="true" skinClass="CustomPanel">
        <s:TextArea text="text in panel" />
    </s:Panel>
</s:Panel>

<!-- this won't work -->
<s:Panel skinClass="CustomPanel" mouseEnabled="true">
    <s:Panel>
        <s:TextArea text="text in panel" />
    </s:Panel>
</s:Panel>

<!-- this WILL work -->
<s:Panel skinClass="CustomPanel" mouseEnabled="true">
    <s:Panel skinClass="CustomPanel" mouseEnabled="true">
        <s:TextArea text="text in panel" />
    </s:Panel>
</s:Panel>

It’s a major pain, but it is a workable solution where needed. To create the skin, in eclipse:-

  1. Click ‘file’ > ‘new’ > ‘MXML Skin’
  2. Enter the name for the skin
  3. Set the HostComponent as ‘spark.components.Panel’
  4. Check ‘create as copy of’
  5. Set to copy ‘spark.skins.spark.PanelSkin’
  6. Click ‘finish’
  7. In the ‘<s:SparkSkin ..>’ tag set mouseEnabled=”true”
  8. Set  mouseEnabled=”true” on your ’<s:Panel ..>’ tag
  9. On your ‘<s:Panel ..>’ tag set skinClass=”" to your new skin class

Now cut/copy/paste should appear in your context menu.

Nov
3

By

Flex Itemrenderer content overflow

Category: FlexTags: , , , , 2 Comments

There seems to be a problem with MXItemRenderer derivative classes resizing percentage-based widths.

datagrid:-

<mx:DataGrid id="dataGrid" dataProvider="{dataProvider}"
includeIn="data"
sortableColumns="false"
resizableColumns="false"
draggableColumns="false"
verticalScrollPolicy="on"
wordWrap="true"
variableRowHeight="true"
rowCount="10" maxHeight="500" width="100%">
<mx:columns>
<mx:DataGridColumn headerText="new data" itemRenderer="com.test.NewItemRenderer"/>
</mx:columns>
</mx:DataGrid>

newItemRenderer.mxml:-

<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"  focusEnabled="true" width="100%">
<s:Label text="{data}" lineBreak="toFit" width="100%"/>
</s:MXDataGridItemRenderer>

will cause the content to spill over into the next row (or clip if clipAndEnableScrolling is true) when the itemrenderer is recycled during scrolling the datagrid.
If I set the width to a pixel size it will draw correctly.

Only thing similar I have come across is this issue on stackoverflow

If anyone has a better workaround that can keep the percentage based width I’d love to hear it!

May
9

By

Thoughts on Flex 4

Category: Flex, ProgrammingTags: , , , , , Leave a Comment

I have been working on a Flex 4 project for the past 3 or so months using the Potomac Framework (an OSGi-like framework for flash). We started off with the Flex 4 Beta 2 framework and have now moved to stable, and I have to say, for a 4th iteration, the IDE still seems years behind Java in Eclipse.

There’s a few nifty features like the design view which will let you filter by state but things like errors being underlined as well as a gutter mark make things a lot easier and formatting code seems to be limited to ctrl+a the file and then fix indentation. All the magic functions like refactoring out methods and variables that us Java programmers take for granted these days are staples of Eclipse, IntelliJ and Netbeans. Sure, you can go without all the fluff and I know guys who are adamant that fully featured IDEs are the work of Satan, however they save me several hours over the course of a week spent coding.

What is there in Flash Builder is also pretty buggy…. auto organise imports has a life of its own, often deleting used imports at random and the build path often leaves classes un-included – especially when you copy/paste classes from other modules. That’s the two main offenders that plague me day-to-day, there are several more however they could also be related to the Potomac Framework which is currently in Beta.

There are a couple of plugins that address one or some of these issues:- one such option is SourceMate (written by the same folks who wrote the potomac framework) but spending an extra 80 bucks on top of the flash builder license seems a bit steep, and my last play with the beta had all those methods in their own menu rather than under refactor/source menus. It does what it says it will, and if the extra cash doesn’t rankle it’s worth a look.

I’m surprised Adobe didn’t just dump a pile of money in their laps and just shunt it into the flash builder code, and chances are they are working on the same functionality as we speak meaning SourceMate will need to keep a step or three in front of adobe in order for it to remain a viable investment.

No doubt building an IDE to this point is no mean feat, however I would have thought that Adobe would have thrown the extra resources at it to provide a more polished product when the likes of Silverlight, HTML5 and JavaFX (if it survives the Oracle merger) are gaining serious interest among developers and designers.