I want to draw a gradient to a canvas and add it to an AbsolutePanel, thus i need width and height of absolutePanel to define gradient vector. But event if I add AbsolutePanel to RootLayoutPanel (via the north-widget of a DockPanel, which width set to 100%) and call a method setGradient() after, i still get 0 for width and height. How can i get the dimensions of the panel?
Use getOffsetWidth() and getOffsetHeight() methods. The doc is here:
Gets the object's offset width in pixels. This is the total width of the object,
including decorations such as border, margin, and padding.
The methods are defined in UiObject, so common for all widgets.
Related
Is there a way to change the height of a text field on the whole figure without changing the x and y position?
To change we must use the position, which requires to change the coordinates. I would like to change only the height, without changing x and y.
Just store the current x and y, and use those in your set call like so:
old_pos = get(text_field_handle,'Position');
set(text_field_handle,'Position',[old_pos(1:2),new_width,new_height]);
Well, you can change the FontSize property, this won't change the coordinates, but will increase width as well as height. See Text Properties in the doc for more details.
I am assuming you are working with uicontrol('style','text').
From the uicontrol properties you have:
Position
position rectangle
*Size and location of uicontrol*. The rectangle defined by this property
specifies the size and location of the control within the parent figure
window, uipanel, or uibuttongroup. Specify Position as:
[left bottom width height]
where left and bottom define the distance from the lower-left corner of the
container to the lower-left corner of the rectangle. width and height are the
dimensions of the uicontrol rectangle.
You can then just change the width and height keeping the original left and bottom.
One can set the Margin property of a text object to increase the height of the object without changing the fontsize, but this influences both the height and the width of the text object. I am not sure what it means to make the height smaller than what Matlab thinks is the text height, so I will assume you are interested in increasing the size.
Increasing the height of the text object is relatively easy if you are willing to use the LaTeX interpreter. You just need to add an "empty" box of whatever height you want:
text(0.5, 0.25, 'Hello World\parbox{\textwidth}{\vspace{1in}}', 'Interpreter', 'LaTeX', 'BackgroundColor',[1, 0, 0]);
This won't increase the height by exactly 1 inch, instead it will be more like 1 inch minus a baseline skip. Determining the actual height increase in displayed units adds even more problems. You might be able to change the height with unicode characters, and hence skip the LaTeX interpreter, but I have no idea how.
I am trying build a UI with a VerticalPanel inside a ScrollPanel inside another VerticalPanel. I need the ScrollPanel to stretch to its parents height and width, so I set the height and width to 100%. The problem is, if the child VerticalPanel exceeds the size of the parent's, the ScrollPanel stretches to fit the child, beyond the limits of its parent.
Are there any CSS properties to limit the size of the ScrollPanel? I can't use maxHeight/maxWidth because I don't know the dimensions of the parent and would like to continue using "100%" as the width/height values.
Thanks!
unfortunately, you can't set ScrollPanel sizes to percentage. If you want to set your scrollPanel height to client's view height, you have to manage its height on your code to Window.getClientHeight().
You can not specify scrollpanel height in percentage. This should be absolute not relative. You have to modify your code and replace percentage to px or em but not percentage.
For more detail refer Scroll Panel Height
I need to render a TextArea in an exact pixel width for the special purposes of my GUI.
When I set its width to "250px", it comes out as 256px.
Is there a way to override this behavior so I can render it as 250px exactly?
When you use setWidth(), you're effectively setting the element's content width.
To get the offset width use UIObject#getOffsetWidth(). This will return the width including padding and border (but not margins).
References on W3C
Computing widths and margins
The box model
I want to have a two widgets to stack up
X
Y
I want Y to take up as much height as it needs (its static in size, roughly 50px depending on browser font, etc) and remain affixed to the bottom of the screen, and X to take the rest of the vertical space.
X happens to be a scrollpanel with VerticalPanel and more inside, Y is a Grid and I've tried putting them in various containers, but they all seem to want a size for Y (ie. DockLayoutPanel & LayoutPanel). If I specify a size for Y it ends up with white space at the bottom on one browser or another. Any advice?
It's just not possible in HTML/CSS. If you absolutely cannot know the height of Y in advance, the way around it would be to:
Attach this widget somewhere off-screen
Measure it's height using yWidget.getOffsetHeight()
Remove it
Add it to your LayoutPanel and setting the 'bottom' coordinate to 0 and 'height' to the measured height.
I have a horizontalpanel with 3 verticalpanels inside.
In the verticalpanels there are custom widgets
I need all verticalpanels has the same height (even if they have different number of widgets inside) and a button in the empty space.
So, I put all panels height = 100% and the buttons height = 100%.
The problem is that the verticalpanel cells height are bigger than my widgets, so it left a space between all verticalpanels widgets.
Here is an example
How can I adjust the verticalpanels cells height to my widgets height. My widgets are not images like in the example, so i can't know the widgets height.
I have a lot of time in this problem, anyidea will help
Thx!!!!
Haven't tried it, but this should work or at least give you something to start:
VerticalPanel.setCellHeight(yourWidget, Integer.toString(yourWidget.getElement().getOffsetHeight())+"px");
What it does:
setCellHeight() sets the height of the cell the widget is in you pass to the function.
The second parameter in the function is the height of that cell. This gets a little tricky because you don't know the height.
With the getElement() you get the Element of that widget in the DOM of the browser, on that element you can call getOffsetHeight().
getOffsetHeight() returns an integer so you need to cast it into a String and concatenate "px" to it so the browser knows it's pixel and not em or something like that.