Make View have a weight, but at least be wrap_content - android-layout

I have a LinearLayout with a ScrollView and a TextView below it. I want the TextView to take up 1/8th of the screen. So I set its weight to 1 and the ScrollView's weight to 7.
But now on small screens, especially with soft keyboard, the text will be cut off. Is there any way to divide the screen like that, but still make sure the TextView has enough space for its content?
I tried android:minHeight, which apparently does nothing in this case and setting android:layout_height to anything but 0dp will make the View bigger no matter what, which is not what I need.

You could either:
Have a different layout for small screens: http://developer.android.com/guide/practices/screens_support.html
Create your own MinHeightFrameLayout, extending FrameLayout, and override onMeasure() to supply a minimum height: Authorative way to override onMeasure()?

Related

How to animate resize/reposition of a Flutter Column when a child is added with a ScaleTransition

I'm implementing a login screen. It has a centred Column containing a TextField for entering an email address and a number of buttons for social sign-in. When a button is pressed, the Column is rebuilt with a CircularProgressIndicator (spinner) added at the bottom. I've wrapped the spinner in a custom widget that manages a ScaleTransition animation. That works OK, but the Column grows and shifts up to accommodate the final full size of the spinner immediately instead of moving smoothly with the animation.
I also wrapped the Column in an AnimatedSize widget using the same curve and duration as the ScaleTransition, but it hasn't helped. The root of the tree is a Consumer of the state that triggers the addition of the spinner so the animations should both be starting together. Maybe the the spinner needs to be permanent for this to work, but it doesn't seem desirable because its API doesn't provide a way to pause the animation. It would presumably constantly use some power to animate itself even when it isn't visible. I'm fussy about that sort of thing.
It looks like I might have to use an AnimatedList, but it doesn't seem semantically correct because the contents aren't really a list. So is there a more generic way to animate the size (and position) of parent widgets like Column and Center to track an animated size change of their children?

Vaadin 8 View: No horizontal scrollbar on window resizing

I have a Vaadin 8 application with several views.
public class ViewName extends Panel implements View {
There is a VerticalLayout as main layout in the panel.
public ViewName() {
setSizeFull();
VerticalLayout mainLayout = new VerticalLayout();
setContent(mainLayout);
Then I have many different layouts (HorizontalLayout, GridLayout) or Components such as Label being added as components to the mainLayout. For the HorizontalLayouts I often do the following to use the full width of the screen:
hLayout.setWidth("100%");
I have a lot of icons, grids etc. Everything is OK as long as I don't resize the window.
When I resize the window to a small size I get a mess (icons, text etc. on top of each other) and no horizontal scrollbar. (However, the grids get horizontal scrollbars.) I have tried many things to fix this. If I add
mainLayout.setSizeFull();
or
mainLayout.setWidth("100%");
I have a mess on the big screen already. I also tried the CSS for the mainLayout as described here. I get several scrollbars but none for the window itself!
The only component that resizes correctly is a Label added to the mainLayout, e.g.:
Label title = new Label("Some text",ContentMode.HTML);
title.setWidth(100, Unit.PERCENTAGE);
mainLayout.addComponent(title);
mainLayout.setComponentAlignment(title, Alignment.MIDDLE_CENTER);
I also noticed that anything in a GridLayout seems to stay in place after resizing but is not vissible since I have no scrollbar. However, icons in a HorizontalLayout get on top of each other.
What is wrong? Please, I need a general instruction on which layout I should use as main layout for my view panel, how to size the components and how to get ONE horizontal scrollbar for the main window if necessary.
The problem is that you are setting the width of your mainLayout to the width of your view. This means, that your mainLayouts width will never be bigger than your views width. So no scroll bar will appear.
According to the information you posted, changing your mainLayouts width to undefined should fix the problem.
mainLayout.setWidth("-1px");

iOS view size and position hard-coded only?

I'm new to Macs and iOS, I got my app running on webOS, Android, and WPF/Windows. In all cases the size of, say, a 'widget' to display a bunch of text, can change depending on the dimension of the text to be displayed, as well as the position can be up against another widget. As the text size changes, the position will change so that all the widgets are crammed together nicely.
I've been searching for this capability in IOS4 in books and on-line, and it's starting to look like in iOS, you have to actually calculate the size of the text to be displayed in ViewText and then change the dimensions of ViewText, which of course then bumps other Views around to accommodate this size change. It sounds like a nightmare. Isn't there some other way to do this (like all the other GUIs can do) to size based on content, and to position relative to other Views like stacking them all together whatever size they are?
Same with ScrollView, it looks like the size of the window you actually see has to be manually specified as well, instead of, say, taking up the entire viewable window and then you can populate the ScrollView with a bunch of sub-views, some of which are below the initially viewable area? I tried this in Xcode4, but so far, haven't gotten it to work.
Similarly with creating an object with a NIB and instantiating that NIB onto an existing View, how does it determine where to position this NIB onto the existing screen?
Thanks!
Paul,
For the scrollview you need to set the bounds so it fills the screen or the area you wish it to occupy, it will then automatically generate scrollbars based on the layout within it. In the land of iOS you do have to do extensive layout work such as positioning and sizing your controls but you can also use the UIAutoResize (if I remember correctly) masks such as if they are anchored to a size, fill the area, etc. It's a little complicated to learn initially but you'll get the hang of it.
As for text you just need to use the right control, I believe what you want is a UITextView and set the options on it as needed.
When you view a XIB it's going to layout initially as you have it, again, you need to position your controls AND set their anchors (autoresize masks) so they adjust based on the screen size (phone vs. pad) and orientation: landscape vs. portrait.
HTH

layout_width and android:layout_weight manipulations with gaps (margins) and paddings

The combination of having, for example, two buttons in some layout with
android:layout_width="0dip" android:layout_weight="1"
properties works just fine, both buttons will occupy equal space!
But what if I want to have 2 buttons but also a space for one more, and that space to be equal like the space the buttons will occupies.
Put in other words, I want to have a buttons with
android:layout_width="0dip" android:layout_weight="1"
properties and a space on the right of the buttons that will act just like invisible button with android:layout_width="0dip" android:layout_weight="1" properties
Is there a clean way to do this ?
I do not want to do hacks like textview with no text on it and android:layout_width="0dip" android:layout_weight="1" properties ...
I want to know is there way to put 'weight' on the margins or to the paddings.
I think there is no such a thing but I want to hear your opinion and your suggestions for this kind of layouts, that shrink depending on the screen width.
You should look at the weightSum property.
If you place the 2 elements in a horizontal LinearLayout, each element with layout_weight=1, declare the weightSum=3 of the LinearLayout, this should result in exactly what you need.
Also, if you decide to hack your way through this, check out a Space view - its a lightweight view for such cases.
This isn't exactly the answer to your question, but you can set a button to visibility "INVISIBLE" (as opposed to GONE), and it'll be invisible but still occupy the same space.
Otherwise, try making the layout_weight of your button half the weightSum specified in the containing layout and align your button to the left. If it doesn't work, and you don't like the solution in the first paragraph, you can just use a View as a spacer item.
use android:weightsum=100 in main layout and whatever the size u need for the buttons divide the sum into that number of parts and there in your buttons use android:layout_width=" ". It automatically sets the spacing and the size of the buttons.

ScrollView as subview does not respect frame boundaries

I have a UIScrollView (managed by a view controller) which I am using both full screen and as a subview. The full screen version works fine - the subview does not.
The subview is positioned so that it takes up about the bottom half of the screen, with a small - 20 pixels or so - margin at the bottom.
Initially it displays in the correct position but overwrites the bottom margin - even though the scrollview's frame is set to leave the margin.
When I scroll the view up by dragging it, the whole view moves upwards and obscures the top of the window. The frame stops moving when it hits the navigation bar at the top and starts scrolling like a normal scrollview. If I scroll it enough it eventually reveals the margin at the bottom of the screen.
I am at a loss to know what to do - I've tried every spring combination I can think of. I'm now looking at subview clipping.
Images below. The first shows the scrollview on initial page load, positioned correctly aside from lower margin overwrite. The scroll view has a white background.
The second image shows it scrolled up toward the top:
The third image shows it scrolled all the way up to the top - note that the lower margin has become visible.
I'm not 100% sure on this one, but worthy the shot: my guess is you're likely not setting the Bounds property correctly on your table.
To solve this issue, the easiest way would be to set myscrollview.clipsToBounds = true.
Something is definitely wrong here. I think what happens is that you are adding the same instance of scrollview as a subview on itself. So basically what you are left with, is one instance alone. Anything you add to the "subview", is basically added on the superview, since it is the same object.
For example, this is what I think you are doing in the view controller:
//...
private UIScrollView myScrollView;
public override void ViewDidLoad()
{
this.myScrollView = new UIScrollView();
this.View = this.myScrollView;
this.View.AddSubview(this.mySrcollView); // same instance
this.myScrollView.AddSubview(aUIButton); // "aUIButton" will be added in View also, since it is the same object
}
If this is the case, it is wrong. I suggest not changing the controller's view at all. If you want to have a controller that has a fullscreen UIScrollView, just create it and add it as a subview, making sure the AutoSizesSubviews property to true.
That's my understanding at least.

Resources