How to wrap contents like image, button inside Android layouts?
I want to pl开发者_如何学Goace list of buttons in a layout and I want them to flow to automatically. Take a look at this picture, This is how WrapPanel wraps its content in WPF. Is there a way I can do this in Android?
(source: microsoft.com)You use a linearlayout in android which allows to layout childs in either vertical or horizontal order. You put the buttons inside the linearlayout.
You should go through this tuorial on android layouts. AbsoluteLayout in the link is depracated.
My knowledge of wrap panel is purely based on the link you attached as I haven't worked with WPF. This is from what i understood. Android doesn't have a wrap panel layout where child views break to next line when there is less space. Your options are
to use scrollviews to scroll if the views are bigger than the screen.
Use the layout_weight property for childs views in a linearlayout. This will make the views to
resize itself to changing sizes.Create a custom layout by extending the ViewGroup class where you measure the child views and decide their position based on the available screen width.
The first 2 options are not exactly what you want. They are alternative approaches with what android provides. But if you want exact thing, you need to make it yourself.
This looks like a LinearLayout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button android:text="Button" android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<Button android:text="Button" android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<Button android:text="Button" android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
</LinearLayout>
For more info on using XML layouts in Android, see this good introduction on the android Developer site:http://developer.android.com/resources/tutorials/views/index.html
i guess you need to use RelativeLayout in order to achieve that easily.
here's the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#c0c0c0"
>
<Button
android:text="Button"
android:id="@+id/button3"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</Button>
<LinearLayout
android:id="@+id/linearlayout01"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/button3"
android:layout_alignParentLeft="true"
android:orientation="horizontal"
android:layout_marginRight="21dp"
>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_weight="2"
android:id="@+id/button1"
android:layout_height="wrap_content"
android:layout_gravity="left">
</Button>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:id="@+id/button1"
android:layout_height="wrap_content"
android:layout_weight="2">
</Button>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/linearlayout01"
android:layout_alignParentLeft="true"
android:weightSum="3"
>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:id="@+id/button1"
android:layout_height="wrap_content"
android:layout_weight="1">
</Button>
</LinearLayout>
Hope this helps! ;)
精彩评论