Can't change font in Flex - Spark RadioButton - apache-flex

I am trying to change the font size and family of a spark Radiobutton I create in run time:
var radio:RadioButton = new RadioButton;
radio.layoutDirection = "rtl";
var format:TextFormat = new TextFormat();
format.font = "Tahoma";
format.color = 0x336699;
format.size = 13;
radio.setStyle("embedFonts", true);
radio.setStyle("textFormat", format);
radio.label = text;
radio.groupName = "radiogrp_" + index.toString();
hgrp.addElement(radio);
No matter what I try, the font stays the same. Both family and size remain default.
Thanks.

Define a nice TextFormat and then use it with setStyle:
attribFormat = new TextFormat(null, fontsize, 0x000000, null, null,null,null,null,"left");
myRadio.setStyle("textFormat", attribFormat);
Hope it helps!

Try
var radio:RadioButton = new RadioButton;
radio.layoutDirection = "rtl";
radio.setStyle("embedFonts", true);
radio.setStyle("fontFamily", "Tahoma");
radio.setStyle("color", 0x336699);
radio.setStyle("fontSize", 13);

I try this it works
var radio:RadioButton = new RadioButton();
radio.addEventListener(FlexEvent.CREATION_COMPLETE, onRadioAddHandler);
radio.label = "Some text";
radio.x = 200;
this.addElement(radio);
Handler
private function onRadioAddHandler(event:Event):void {
var radio:RadioButton = RadioButton(event.target);
radio.layoutDirection = "rtl";
radio.setStyle("fontFamily", "Tahoma");
radio.setStyle("color", 0x336699);
radio.setStyle("fontSize", 25);
}

Related

I am trying to programmatically add images to a list/array and access them in a for each loop to change their source image

I have been trying to add images to an array and then access their properties to change their source image in a loop.
Detailed: I create a grid with a layout for each for each grid element, in that layout there is a GridImage, who's source folder is set to "ClosedFolder.png", when I click one of the layouts it should change the clicked layouts folder to "OpenFolder.png".
for (int eachCount = 0; eachCount <= MaxRows / MaxCols; eachCount++)
{
Selectedrid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(80, GridUnitType.Absolute) });
for (int newCol = 0; newCol <= MaxCols; newCol++)
{
for (int newRow = 0; newRow <= MaxRows / MaxCols; newRow++)
{
if (folderIndex >= DirectoryArrayList.Count) { break; }
var folder = DirectoryArrayList[folderIndex];
var label = new Label()
{
Text = folder.Name,
FontSize = 12,
VerticalTextAlignment = TextAlignment.Center,
HorizontalTextAlignment = TextAlignment.Center
};
var GridImage = new Image() { Source = "ClosedFolder.png", StyleId = "Image" };
var GridTap = new TapGestureRecognizer();
var Layout = new StackLayout() { StyleId = "StackContent" };
var folderSelection = _mainFolder + "/" + folder.Name;
GridTap.Tapped += async(object sender, EventArgs e) =>
{
FileHandler.CreateTextFiles(folderSelection, "File_" + FileID + ".txt");
files = FolderOptions.AddFilesToList(folderSelection);
lst.ItemsSource = files;
//foreach (Image img in ImageList) I know this i incorrect, just an example of what I think!
//{
// img.Source = "ClosedFolder.png";
//}
GridImage.Source = "OpenFolder.png"; // clicked layout gets its openfolder.png
};
Layout.Children.Add(label);
Layout.Children.Add(GridImage);
Layout.GestureRecognizers.Add(GridTap);
Selectedrid.Children.Add(Layout, newCol, newRow);
folderIndex += 1;
FileID += 1;
}
}
}
Not sure on the declaration of the array and how to implement it.
I added the following into my BasicGrid method ...
var GridImage = new Image() { Source = "ClosedFolder.png", StyleId = "Image" };
var ImageList = new List<Image>{};
ImageList.Add( GridImage );
for (var i = 0; i < ImageList.Count; i++)
{
var img = ImageList[i];
img.Source = "ClosedFolder.png";
} GridImage.Source = "OpenFolder.png"
Just adding to say that Jason's information is the most likely direction I will go in, but as I am still learning it will take me time and I dint want to keep this open while I do that :-)

Avatar image clickable and display on screen Xamarin.Forms

I want to make my avatar image which is in a circle clickable. After click it has to be displayed on screen like in FB. So how I can implement this in my code?
listView.Header = "";
listView.HeaderTemplate = new DataTemplate(() =>
{
var avatarLayout = new StackLayout()
{
HeightRequest = 350,
};
var grid = new Grid();
grid.HeightRequest = 400;
grid.BackgroundColor = Color.White;
grid.RowDefinitions.Add(new RowDefinition());
grid.RowDefinitions.Add(new RowDefinition());
var bgrImg = new Image();
bgrImg.Aspect = Aspect.Fill;
bgrImg.Source = ImageSource.FromFile("abstract_background.jpg");
var avImg = new CircleImage();
avImg.VerticalOptions = new LayoutOptions(LayoutAlignment.Center, false);
avImg.Source = ImageSource.FromFile("about_background.png");
grid.Children.Add(bgrImg, 0, 0);
grid.Children.Add(avImg);
Grid.SetRowSpan(avImg, 2);
avatarLayout.Children.Add(grid);
Example of my
avatar
You can make an element tappable by using a GestureRecognizer
var tapGestureRecognizer = new TapGestureRecognizer();
tapGestureRecognizer.Tapped += (s, e) => {
// handle the tap
};
image.GestureRecognizers.Add(tapGestureRecognizer);

Flex: access dynamically added RicheEditableText in other function

When I click on a userlist, the function addTab is triggered:
private var counter:int = 0;
public function addTab():void {
var new vBox:VBox = new VBox();
var textBox:RichEditableText = new RichEditableText();
var nameEm:String = "dynamicTextBox" + counter;
textBox.id = nameEm;
counter++;
var textFlow:TextFlow = new TextFlow();
vbox.addChild(textFlow);
vbox.addChild(textBox);
tabNavigator.add(vBox);
}
In another function, I would like to add Rich Text to the newly created TextBox, but I can not access it.
I tried getChildByName(vbox) and vbox.getChildByName(textBox), but that doesn't seem to work.
To get childbyname assigned a name to richeditable text and if you want to get it by counter then give name to vbox also, as in the sample here:
private var counter:int = 0;
public function addTab():void {
var new vBox:VBox = new VBox();
var textBox:RichEditableText = new RichEditableText();
var nameEm:String = "dynamicTextBox" + counter;
textBox.id = nameEm;
vBox.name=nameEm;
textBox.name=nameEm;
counter++;
var textFlow:TextFlow = new TextFlow();
vbox.addChild(textFlow);
vbox.addChild(textBox);
tabNavigator.add(vBox);
}
If you know the index then
var vb:VBox = tabNavigator.getChildByName("dynamicTextBox"+index) as VBox;
var txt:RichEditableText=vb.getChildByName("dynamicTextBox"+index) as VBox;
So this will give you RichEditableText.
Or if you want to get access just after adding in to tab then return RichEditableText from the addtab function.
Elaborating on my comment, the idea is that you do something like this:
private var counter:int = 0;
public function addTab():void {
var new vBox:VBox = new VBox();
vBox.name = "dynVbox" + counter;
var textBox:RichEditableText = new RichEditableText();
textBox.name = "dynamicTextBox" + counter;
var textFlow:TextFlow = new TextFlow();
textFlow.name = "dynamicTextFlow" + counter;
vbox.addChild(textFlow);
vbox.addChild(textBox);
tabNavigator.add(vBox);
counter++;
}
Now, outside this function, you just need to know the counter number of the vBox you want. So for example:
var myBox = tabNavigator.getChildByName('dynVbox'+ 32).getChildByName('dynamicTextBox'+32)
Without seeing more of your code, I don't know if this is the best way to go about it, but if you want to mark your boxes with some dynamically generated name and look them up later, this will work
Example documentation

load symbol of flash in flex at runtime

Hey people, I've this huge problem loading a symbol from a swf file in the application at runtime. I want to load it and pass it as a argument to another class where it could be used further. The symbol name is passed on from the array collection from the "o" object. Can anybody please tell me what's the right way to go about it.. Thanks in advance..!!
Following is the code for reference..
public override function Show(o:ObjectProxy):void
{
var _this:Weather;
var _super:ContentItem;
var item:WeatherItem;
var items:ArrayCollection;
var widgetCount:Number;
var headlineFontSize:int;
var conditionsIconThemeLoader:Loader;
this.m_weatherWidgetContainer = new HBox();
super.Show(o);
_this = this;
_super = super;
(undefined == o["HeadlineFontSize"]) ? headlineFontSize = 20 : headlineFontSize = o["HeadlineFontSize"];
if (undefined != o["direction"])
this.m_textDirection = o["direction"];
if (o.LargeUrl.Forecast is ArrayCollection)
items = ArrayCollection(o.LargeUrl.Forecast);
else
items = new ArrayCollection([o.LargeUrl.Forecast]);
widgetCount = this.m_computeWidgetSpace(items.length);
conditionsIconThemeLoader = new Loader();
conditionsIconThemeLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(e:Event):void
{
for(var i:uint = 0; i < widgetCount; i++)
{
var symbolClass:Class = e.currentTarget.loader.contentLoaderInfo.applicationDomain.currentDomain.getDefinition(int(items[i].condition)) as Class;
var symbolInstance:Sprite = new symbolClass();
item = new WeatherItem();
item.Show(items[i], headlineFontSize, symbolInstance, widgetCount);
_this.m_weatherWidgetContainer.addChild(item);
}
});
conditionsIconThemeLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, function(e:IOErrorEvent):void
{
Alert.show("Failure loading " + WidgetStylesheet.instance.Weather_Widget_Theme + ".swf");
});
// Attempt to load theme weather icon file
conditionsIconThemeLoader.load(new URLRequest("assets/animation/" + WidgetStylesheet.instance.Weather_Widget_Theme + ".swf"));
super.media.addChild(this.m_weatherWidgetContainer);
}
Heres the answer
public override function Show(o:ObjectProxy):void
{
var _this:Weather;
var _super:ContentItem;
var conditionsIconThemeLoader:Loader;
var loaderContext:LoaderContext;
this.m_weatherWidgetContainer = new HBox();
this.m_weatherWidgetContainer.percentHeight = 100;
this.m_weatherWidgetContainer.percentWidth = 100;
super.Show(o);
_this = this;
(undefined == o["HeadlineFontSize"]) ? this.m_headlineFontSize = 20 : this.m_headlineFontSize = o["HeadlineFontSize"];
if (undefined != o["direction"])
this.m_textDirection = o["direction"];
if (o.LargeUrl.Forecast is ArrayCollection)
this.m_items = o.LargeUrl.Forecast;
else
this.m_items = new ArrayCollection([o.LargeUrl.Forecast]);
conditionsIconThemeLoader = new Loader();
loaderContext = new LoaderContext(false, ApplicationDomain.currentDomain);
conditionsIconThemeLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, this.m_loaderSuccess);
conditionsIconThemeLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, this.m_loaderFail);
// Attempt to load theme weather icon file
conditionsIconThemeLoader.load(new URLRequest("assets/animation/" + WidgetStylesheet.instance.Weather_Widget_Theme + ".swf"), loaderContext);
this.m_weatherWidgetContainer.addEventListener(FlexEvent.CREATION_COMPLETE, this.m_drawHorizontalLine);
super.media.addChild(this.m_weatherWidgetContainer);
}

Flex, Problem when jpegencoding two bitmaps in sequence

I am creating this "drawing application", where the user can click "preview" and it will take what they made, draw a bitmap, and then I want to split that bitmap into left and right images. I create the first bitmap, encode it as a jpeg, and then use that to cut the left and right out using copypixels. I then reform the images together with a space inbetween in one canvas, and draw that canvas. Everything works fine up there.
When I go to encode the new bitmap, and then offer it to save out, the saved image is blank. I have tested everything up to that point and it all works fine. I see the images on screen, I can save out the first bitmap fine.. but the second one is always blank. Here is some sample code, possibly someone can help me out.
_mainBmd = new BitmapData(_jacketWidth, _jacketHeight);
_mainBmd.draw(_imageHolder);
startEncode(_mainBmd);
private function startEncode(imageBitmapData:BitmapData):void
{
var encoder:JPEGAsyncEncoder = new JPEGAsyncEncoder(100);
encoder.PixelsPerIteration = 150;
encoder.addEventListener(JPEGAsyncCompleteEvent.JPEGASYNC_COMPLETE, encodeDone);
encoder.encode(imageBitmapData);
}
private function encodeDone(event:JPEGAsyncCompleteEvent):void
{
_leftBmd = new BitmapData(sideWidth, sideHeight);
var lRect:Rectangle = new Rectangle(0,0, sideWidth, sideHeight);
var lPoint:Point = new Point(0,0);
_leftBmd.copyPixels(_mainBmd, lRect, lPoint);
_rightBmd = new BitmapData(sideWidth, sideHeight);
var bWidth:Number = 200;
var sWidth:Number = 111;
var rRectWidth:Number = (bWidth/2 + sWidth) * Constants.print_dpi;
var rRect:Rectangle = new Rectangle(rRectWidth, 0, sideWidth, sideHeight);
var rPoint:Point = new Point(0, 0);
_rightBmd.copyPixels(_mainBmd, rRect, rPoint);
var lbm:Bitmap = new Bitmap(_leftBmd);
var rbm:Bitmap = new Bitmap(_rightBmd);
//now combine the two images into one holder with a space in the middle
//left Image
var l_Image:Image = new Image();
l_Image.source = lbm;
//right image
var r_Image:Image = new Image();
r_Image.source = rbm;
var newRender:Canvas = new Canvas();
newRender.clipContent = false;
newRender.minHeight = 0;
newRender.minWidth = 0;
newRender.addChild(l_Image);
r_Image.x = 500;
newRender.addChild(r_Image);
fcBMD = new BitmapData(renderW, renderH);
fcBMD.draw(newRender);
startEncode2(fcBMD);
}
private function startEncode2(imageBitmapData:BitmapData):void
{
var encoder:JPEGAsyncEncoder = new JPEGAsyncEncoder(100);
encoder.PixelsPerIteration = 150;
encoder.addEventListener(JPEGAsyncCompleteEvent.JPEGASYNC_COMPLETE, encode2Done);
encoder.encode(imageBitmapData);
}
private function encode2Done(event:JPEGAsyncCompleteEvent):void
{
_data = event.ImageData;
}
private function onSaveRenderClick(e:MouseEvent):void //save button listener
{
var fileRef:FileReference = new FileReference();
fileRef.addEventListener(Event.SELECT, onSaveComplete);
fileRef.save(_data, 'testImage.jpg');
}
Is there a special reason why you go trough all the loops of creating a Canvas holder and adding Images?
Why not use copyPixels directly on the final BitmapData that you want to encode:
var backgroundColor:uint = 0xffffff;
fcBMD = new BitmapData(renderW, renderH, false, backgroundColor);
var lPoint:Point = new Point(0,0);
var lRect:Rectangle = new Rectangle(0,0, sideWidth, sideHeight);
fcBMD.copyPixels(_mainBmd, lRect, lPoint);
var rRect:Rectangle = new Rectangle(rRectWidth, 0, sideWidth, sideHeight);
var rPoint:Point = new Point(renderW - sideWidth, 0);
fcBMD.copyPixels(_mainBmd, rRect, rPoint);
startEncode2(fcBMD);

Resources