var viewStack:ViewStack = new ViewStack();
viewStack.percentWidth = 100;
viewStack.percentHeight = 100;
viewStack.addChild(canVas1);
viewStack.addChild(canVas2);
viewStack.addChild(canVas3);
lb = new LinkBar();
lb.dataProvider=viewStack;
Its only displaying canVas3 contents not canVas1 and canVas2
thanks
I think that's what it's supposed to do. It just puts components one on top of the other like a deck of cards, with the topmost (last added) being visible. Check this out.
Related
There is a way to set a Padding of one single element in a VBox having other childrens?
this.layout_p = new VBox();
this.txta_p = new TextArea();
this.m_p = new Button("m");
this.o_p = new Button("o");
this.c_p = new Button("c");
this.oa_p = new Button("oa");
this.np_p = new Button("np'");
layout_p.getChildren().addAll(txta_p, m_p,
o_p, c_p, oa_p, np_p);
layout_p.setAlignment(Pos.CENTER_RIGHT);
I would like to have the button: np_p with a top padding of 50 from others buttons.
So having a separation between oa_p and np_p.
(Without using another VBox for that button and so, setPadding(...))
Setting a padding for a single node does not make sense. Padding is the room between the bounds of a node and it's content, see also the CSS Box Model.
You're actually trying to add a margin here, i.e. some space around the node. This can be done using VBox.setMargin.
VBox.setMargin(np_p, new Insets(50, 0, 0, 0));
I need to disable button depending on some element children amount.
I have tried something like this, which is not right:
HBox userDataHBox = new HBox(new Label("1"), new Label("2"), new Label("3"));
Button btn = new Button();
btn.disableProperty().bind(
Bindings.notEqual(userDataHBox.getChildren().size(), 3)
);
userDataHBox.getChildren().size()
just yields the current size of the list. Nothing to observe there. You could use Bindings.size to get a IntegerBinding for the size that can be used:
btn.disableProperty().bind(
Bindings.size(userDataHBox.getChildren()).isNotEqualTo(3));
Here you go:
btn.disableProperty().bind(
Bindings.createBooleanBinding(()-> userDataHBox.getChildren().size() != 3, userDataHBox.getChildren())
);
I'm creating the Label component like this
var label:Label = new Label();
label.text = "some text";
label.styleName = "someStyle";
addChild(label);
But it stay invisible until I explicit set the width and height.
How can I make the label to be auto resized according to it's text?
I've found the answer to my question here
The solution is to call a measureText() function for the label
var lineMetrics:TextLineMetrics = label.measureText(label.text);
label.width = lineMetrics.width;
label.height = lineMetrics.height;
I've also noticed the above answer doesn't seem to work with spark components. This does however work for me.
label.width = label.measuredWidth;
label.height = label.measuredHeight;
You should be able to use label.percentWidth = 100; to allow the label to automatically grow with the text. If you want it to stay on a single line, you'll also want to set the maxDisplayedLines = 1; property as well.
You may also want to use addElement(label) instead of addChild(label).
I have a several chart components that I have created in Flex. Basically I have set up a special UI that allows the user to select which of these charts they want to print. When they press the print button each of the selected charts is created dynamically then added to a container. Then I send this container off to FlexPrintJob.
i.e.
private function prePrint():void
{
var printSelection:Box = new Box();
printSelection.percentHeight = 100;
printSelection.percentWidth = 100;
printSelection.visible = true;
if (this.chkMyChart1.selected)
{
var rptMyChart1:Chart1Panel = new Chart1Panel();
rptMyChart1.percentHeight = 100;
rptMyChart1.percentWidth = 100;
rptMyChart1.visible = true;
printSelection.addChild(rptMyChart1);
}
print(printSelection);
}
private function print(container:Box):void
{
var job:FlexPrintJob;
job = new FlexPrintJob();
if (job.start()) {
job.addObject(container, FlexPrintJobScaleType.MATCH_WIDTH);
job.send();
}
}
This code works fine if the chart is actually displayed somewhere on the page but adding it dynamically as shown above does not. The print dialog will appear but nothing happens when I press OK.
So I really have two questions:
Is it possible to print flex components/charts when they are not visible on the screen?
If so, how do I do it / what am I doing wrong?
UPDATE:
Well, at least one thing wrong is my use of the percentages in the width and height. Using percentages doesn't really make sense when the Box is not contained in another object. Changing the height and width to fixed values actually allows the printing to progress and solves my initial problem.
printSelection.height = 100;
printSelection.width = 100;
But a new problem arises in that instead of seeing my chart, I see a black box instead. I have previously resolved this issue by setting the background colour of the chart to #FFFFFF but this doesn't seem to be working this time.
UPDATE 2:
I have seen some examples on the adobe site that add the container to the application but don't include it in the layout. This looks like the way to go.
i.e.
printSelection.includeInLayout = false;
addChild(printSelection);
Your component has to be on the stage in order to draw its contents, so you should try something like this:
printSelection.visible = false;
application.addChild(printSelection);
printSelection.width = ..;
printSelection.height = ...;
...
then do the printing
i'm not completely sure, but in one of my application I have to print out a complete Tab Navigator and the only method i have found to print it is to automatically scroll the tabnavigator tab in order to show the component on screen when i add them to the printjob.
In this way they are all printed. Before i created the tabnaviagotr scrolling the print (to PDF) result was a file with all the pages of the tab but only the one visible on screen really printed.
I havn't been able to find the answer to this, and I hope theres an easy and obvious answer i just havn't found yet...
Within flex (i.e. using actionscript and mxml), given two Sprites, is there a way to force one to be displayed on top of the other when they overlap?
Thanks!
Yep, it all depends where they are in the display list.
so in this example clip 2 is on top
var container : Sprite = new Sprite();
var clip1 : Sprite = new Sprite();
var clip2 : Sprite = new Sprite();
container.addChild(clip1);
container.addChild(clip2);
and in this example clip 1 is on top
var container : Sprite = new Sprite();
var clip1 : Sprite = new Sprite();
var clip2 : Sprite = new Sprite();
container.addChild(clip2);
container.addChild(clip1);
Just think of it as a big old stack of cards. Take one from the middle and put it on top and that's the one you'll see.
Assumption: Both objects either lie on the stage together or within the same DisplayObject.
private function checkOverlap(obj1:Sprite, obj2:Sprite):void {
//Forces obj1 to appear on top of obj2
if (obj1.parent.getChildIndex(obj1) < obj2.parent.getChildIndex(obj2)) {
obj1.parent.swapChildren(obj1, obj2);
}
}