capital H coder

I recently got down to the “Support Foreign Characters” item in my Knowtes To-Do list, and figured it would be fairly easy to find an example component out there that provided an easy way for users to enter special characters into Flex text controls (TextInput, TextArea, and RichTextEditor).

Unfortunately, both my posts to FlexCoders and my lengthy Google search turned up empty.

So on the off chance that I’m not actually the only person in the world with a need for this type of feature, here is what I came up with (a very simple version of it anyway):

And HERE IS THE SOURCE

Two points worth mentioning:

• The key for getting the unicode characters into the text controls was to use the String.fromCharCode() function.
• To enhance usability, the cursor is placed at the end of the text in the associated control when the character dropdown is closed. The selectionBeginIndex and selectionEndIndex are used for setting the caret position. For the RichTextEditor this property changes to selection.beginIndex and selection.endIndex.

It definitely needs some polishing, but hopefully it will give someone a jump start on providing a simple method of allowing users to easily enter unicode/foreign/special characters in Flex apps.

~Shaun

So we have the ability in Flex to select an image as the background of a container. However, the only control we get over this image is the ability to specify its size. From my background in .NET, I am accustomed to being able to specify the layout of a background image as one of four options:

• Centered: shows up as its default size, centered in the container
• Stretched: made to fill all area of the background (causing distortion if necessary)
• Tiled: repeats itself to fill entire background area
• Zoomed: image stretched as large as possible while maintaining aspect ratio & centered

So what I’m providing here (right-click for code) is my method of providing this functionality as a skin in Flex.



I call it the CuSTomiZableImageSkin (for Center, Stretch, Tile, and Zoom), but you can call it whatever you want (feel free to use and modify it to your heart’s content).

This should work for any containers in your app, and all you have to do to use it is specify the class as your borderSkin, provide a backgroundImage, and set the backgroundSize style to center, stretch, tile, or zoom.

HERE IS THE SOURCE

Possible improvements: allowing a border as well as the image. I haven’t needed a border as well as the image yet, so I haven’t done this.

~Shaun