I need somehow to do this :
I tried playing with Relative Layout, I placed top imageview and bottom button but how do I place my gridview in the center? BUT BETWEEN top image and bottom button?
Have the top image and the bottom button use wrap_content for height, and the GridView use 0dip for height along with a weight of 1. This will cause the top and bottom elements to measure first, and the GridView will get all remaining space in the middle.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView android:id="#+id/top_image"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<GridView android:id="#+id/grid"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" />
<Button android:id="#+id/bottom_button"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
adamp's answer didn't work for me. This is what I found to work perfectly:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView android:id="#+id/top_image"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<Button android:id="#+id/bottom_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
<LinearLayout
android:id="#+id/container_layout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/bottom_button"
android:layout_below="#id/top_image"
android:gravity="center" >
<GridView android:id="#+id/grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
</RelativeLayout>
I've used this with other LinearLayouts in place of the GridView, with android:gravity="center" set on the innermost layout as well to make all of its text views and images centered horizontally as well as vertically.
use something like this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/table">
<TableRow
android:weightSum="100">
<ImageView android:id="#+id/image1"
android:src="#drawable/icon"
android:visibility="visible"
android:gravity="center"
android:layout_weight="50" />
</TableRow>
<TableRow
android:weightSum="100">
<GridView
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</GridView>
</TableRow>
<TableRow
android:weightSum="100">
<Button android:id="#+id/btn1"
android:visibility="visible"
android:gravity="center"
android:layout_weight="50" />
</TableRow>
</TableLayout>
</LinearLayout>
You could try this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView android:id="#+id/top_image"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<GridView android:id="#+id/grid1"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" />
<Button android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Add these to your Grid View:
android:layout_above="#id/bottom_button"
android:layout_below="#id/top_image"
Related
I am struggling with my Android Layout.
I want to create a Linear Layout which contains a Button at the Top, next a List View and when all elements of the list view are displayed I want to show a Fragment which displays Google Maps.
This is my Layout xml file. In that case you can only see the Fragment and the Button but not the listview
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:orientation="vertical"
tools:context="de.mypackage.MyActivity">
<Button
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:id="#+id/button_back"
android:text="#string/back"
/>
<ListView
android:id="#+id/list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"/>
/>
<fragment
android:id="#+id/fragement"
android:name="de.mpackage.MapsFragment"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
tools:layout="#layout/fragment_maps"/>
</LinearLayout>
Any Idea how I can realize my layout?
Try this code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="10dp"
android:weightSum="1"
android:paddingRight="10dp">
<Button
android:id="#+id/button_back"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/back" />
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5" />
<fragment
android:id="#+id/fragement"
android:name="com.yougotag.supplierfieldagent.fragments.AboutFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
tools:layout="#layout/fragment_about_app" />
</LinearLayout>
this will set both in half screen you can change ration of weights in layout.
Advice :
Declare your root layout as RelativeLayout
RelativeLayout is a view group that displays child views in relative
positions. The position of each view can be specified as relative to
sibling elements .
Then use android:layout_below
Positions the top edge of this view below the given anchor view ID.
Accommodates top margin of this view and bottom margin of anchor view.
<fragment
android:id="#+id/fragement"
android:name="de.mpackage.MapsFragment"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_below="#+id/birth"
tools:layout="#layout/list"/>
Try this code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<Button
android:id="#+id/button_back"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/back" />
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<fragment
android:id="#+id/fragement"
android:name="com.yougotag.supplierfieldagent.fragments.AboutFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout="#layout/fragment_about_app" />
</LinearLayout>
Try this :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:paddingLeft="10dp"
android:paddingRight="10dp"
tools:context="de.mypackage.MyActivity">
<Button
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:id="#+id/button_back"
android:text="#string/back"
/>
<ListView
android:id="#+id/list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"
android:layout_below="#+id/button_back"/>
/>
<fragment
android:id="#+id/fragement"
android:name="de.mpackage.MapsFragment"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:layout_below="#+id/list"
tools:layout="#layout/fragment_maps"/>
</RelativeLayout>
I found a solution hope it helps.
In my ListView for the height instead of using 0dp I used wrap_content and adds layout_weight=1 for my Fragment
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EFEFEF"
android:orientation="vertical">
<Button
android:id="#+id/button_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:divider="#null"/>
<fragment
android:name="de.mpackage.MapsFragment"
android:id="#+id/fragement"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="5dp"
android:layout_weight="1"
/>
</LinearLayout>
I am trying to create Custom Gridview with image and text at bottom but when i scroll down then the alignment gets mismatched because of text
Alignment after scrolling down
Alignment beforescrolling down
gridview.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<com.staritsolutions.apptitude.CategoryImageResize_Adapter
android:id="#+id/picture"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_weight="150"
android:textColor="#android:color/black" />
</LinearLayout>
</FrameLayout>
Try changing height of TextView to wrap_content:
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="150"
android:textColor="#android:color/black" />
Try this
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:weightSum="3" >
<com.staritsolutions.apptitude.CategoryImageResize_Adapter
android:id="#+id/picture"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="2"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:gravity="center"
android:layout_weight="1"
android:textColor="#android:color/black" />
</LinearLayout>
</FrameLayout>
You can try this:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<com.staritsolutions.apptitude.CategoryImageResize_Adapter
android:id="#+id/picture"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center"
android:layout_weight=".5"
android:textColor="#android:color/black" />
</LinearLayout>
</FrameLayout>
For TextView - you can set equal weight is 1 & if your text is not big then set fix weight what you want like .2 or .3
I have an activity that contains a horizontal recycler view.
Now the main problem is I want to have a comment layout like the one in whats app which is at the bottom of the screen which is not filling the parent.
activity layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view_mood_detail_activity"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</RelativeLayout>
row view of the recycler view:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:id="#+id/row_layout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_large"
android:layout_marginRight="#dimen/margin_large"
>
<ImageView
android:id="#+id/quote_image_mood_detail_activity"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:scaleType="centerCrop"
/>
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/layout_like_and_share"
android:layout_gravity="right"
/>
<com.ascentbrezie.brezie.custom.CustomTextView
android:id="#+id/comments_count_text_mood_detail_activity"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="#dimen/text_size_small"
android:layout_margin="#dimen/margin_small"
/>
<LinearLayout
android:id="#+id/display_comments_layout_mood_detail_activity"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_margin="#dimen/margin_small"
/>
<include
android:id="#+id/abc"
layout="#layout/layout_add_comments"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
/>
</LinearLayout>
</ScrollView>
</RelativeLayout>
When I use the above two codes I have the output as this
But I want to set the edittext and the button at the button of the layout as the footer,for that when I am using this layout.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:id="#+id/row_layout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_large"
android:layout_marginRight="#dimen/margin_large"
>
<ImageView
android:id="#+id/quote_image_mood_detail_activity"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:scaleType="centerCrop"
/>
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/layout_like_and_share"
android:layout_gravity="right"
/>
<com.ascentbrezie.brezie.custom.CustomTextView
android:id="#+id/comments_count_text_mood_detail_activity"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="#dimen/text_size_small"
android:layout_margin="#dimen/margin_small"
/>
<LinearLayout
android:id="#+id/display_comments_layout_mood_detail_activity"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_margin="#dimen/margin_small"
/>
</LinearLayout>
</ScrollView>
<include
android:id="#+id/abc"
layout="#layout/layout_add_comments"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
Now the problem is I get the XML preview exactly as I want. Have a look [here] but when I run the app on any device I get the output like this.
So the main problem is the footer layout doesn't stretch to fill up the parent and leaves some space to the right of the screen. I have dynamically set the margin for the whole of the view also.
RowLayout is the linear layout inside the scrollview. Card width is the width of the screen
rowLayout = (LinearLayout) holder.v.findViewById(R.id.row_layout);
FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(cardWidth, ViewGroup.LayoutParams.FILL_PARENT);
layoutParams.setMargins(10, 10, 0, 0);
rowLayout.setLayoutParams(layoutParams);
This should do it
<LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"><EditText android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1"/><Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button"/></LinearLayout>
I am creating my custom media player. But, I have a problem stocking the views on each other with the desired portions. I have illustrated my goal in the following picture.
I don't have any problem with top and bottom parts of this image. My problem is that I want to put The purple area on top of the SurfaceView, while its height is 0.2 of the total height of the red area.
Note: I use RelativeLayout for the red area and put the purple area on the proper location (layout_alignParentBottom="true") but I don't know how to set its height like what we do in LinearLayout with Layout_weight.
Edit: this is the xml of the red part
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<SurfaceView
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
<mypackages.MediaPlayerController
android:id="#+id/mediaPlayerController1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
</mypackages.MyMediaController>
</RelativeLayout>
</LinearLayout>
and the layout of MyMediaController:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:orientation="horizontal"
android:layout_gravity="center">
<SeekBar
android:id="#+id/sb"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="left">
<mypackages.CircularImageButton
android:id="#+id/ci1"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:layout_weight="0.1"
app:border="true"
app:border_color="#color/c1"
app:border_width="2dp"
app:shadow="true"
app:shadow_radius="1"
app:shadow_color="#android:color/black"
android:src="#drawable/mediapause" />
<mypackages.CircularImageButton
android:id="#+id/ci2"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:layout_weight="0.1"
app:border="true"
app:border_color="#color/c1"
app:border_width="2dp"
app:shadow="true"
app:shadow_radius="1"
app:shadow_color="#android:color/black"
android:src="#drawable/volumeon" />
</LinearLayout>
</LinearLayout>
I have used LinearLayout in my activity, in that I need to display another LinearLayout containing image to be displayed at the bottom.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:background="#drawable/gamelevelscreen"
android:orientation="vertical" >
.......
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:gravity="center">
</LinearLayout>
</LinearLayout>
But the image is not completely aligned at the bottom. Its a little above the bottom.
I have completed the layout designing and it will be a lot of rework to make it Relative now. Kindly give solution to make it happen in LinearLayout only.
Use Relative layout instead of Linear layout or use Weight for doing this in Linear layout.
Try this it will surely help you.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>
Try this..
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/gamelevelscreen"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:layout_alignParentBottom="true">
</LinearLayout>
</RelativeLayout>
// try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp"
android:orientation="vertical" >
<LinearLayout
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout_AdMob"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<ImageView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher"/>
</LinearLayout>
</LinearLayout>