Flex having a VBox with Vertical Buttons - apache-flex

I am trying to get a left hand like panel bar in my application, one much like the OneNote left hand(notebook) panel.
I have been trying to use a VBox with Buttons and setting the rotation on the buttons to 90. The buttons seem to disappear when I do this.
An example of what I am trying to achieve is here: http://www.rid00z.net/panelBarExample.png
What is the best way to achieve Vertically stacked buttons like this?

try putting all the buttons inside an Hbox and then setting the rotation of the Hbox to 90.
Oh and also make sure you rotate around using a point at the center.

I would create a custom component to do it. I would make each "button" a canvas and display text in it vertically (embedding the font you want to use to do that) - the canvas would have a click event - I would use canvas over a standard Button because it allows more flexibility. In this new component you would have functions to add or delete buttons. I can clarify if it would help.

Related

Is there a javafx panel the user can resize?

I need a javafx component that has a right and left panel with a draggable bar in between so the user can resize the 2 panels. Im having a bunch of trouble finding this - it has to exist. Not sure what it would be called so not sure what to search for. It would be a border container but one you can drag the separators to resize.
There is something like it demoed here:
http://demos.dojotoolkit.org/demos/themePreviewer/demo.html
You are looking for a SplitPane.

arange horizontal line of buttons in Pyside/PyQT/Qt

I want to create a simple GUI with PySide/PyQt.
In this GUI I want to have a raw with severeal push buttons and the length of the buttons I want to be proportional to its text label.
Looking at QPushButton and QHBoxLayout I don't see a posibility this can be done easy.
Any advice in this respect?
Thanks
Dimitar
This is easy to do with Tool Buttons. In Qt Designer:
Create the tool buttons and set the text
Put them in a horizontal layout
Add a horizontal spacer to the beginning and/or the end of the layout
Optionally, you could also:
Set a minimum width/height
Change the size-policy of the buttons to minimum/minimum

Zooming effect on datagrid cell with an image in the itemrenderer

I am not able to figure out how to zoom the image displayed with the help of an item renderer.If i apply the Zoom effect on rollover ,the particular cell zooms the image with the scroll bars.Is their any other way of doing this without showing the scrollbars.
You'll need to duplicate the image and place it outside of the datagrid component. If it's inside the datagrid, it'll be forced into one of the rows. It might be helpful for you to look at the code for the DataGridDragProxy - it does does something sorta similar.

moving image in a div by mouse draging and generating the css dynamically

I want to implement an image/div drag functionality like the one in the tinymce,
when the user click on the image, its border are selected and one can move the image/div around in the editor, and in the meanwhile it generate inline css as well..
Thanks...
You probably want something like jQuery UI's draggables, which allows you to make dragging movements with your mouse which will alter the dragged element's CSS accordingly. Use the start and stop events if you want to change the border color when it is being dragged.

Drawing a rectangle on a flex canvas is there a better way than

To draw a "selection rectangle" from the mouse down , mouse move then remove it on mouse up i currently do the following:
My board is a canvas,
On mouse down i create a new UIcontainer i set his borders.
I update his width and height related the the mouse move position,
on mouse up i remove this child UIcontainer.
Do i have to create a new component for this kind of task or there is a better (lighter way) in flex ?
Thanks,
Here is an Flex selection rectangle example, although I think it won't be a better/lighter way, perhaps you can get some nice ideas from it.
I'd say you got it right.

Resources