Am developing an application for 21.5 screen android device. I have tried the code below and testing in the 10 inch emulator. its looking good. but i want to know whether is it good to use the relative layout or linear layout with weight. Because i don't want the blank space below the layout when it appears in 21,5 inch screen. Please suggest.
My layout code.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:contentDescription="#string/app_name"
android:src="#drawable/image1" />
<com.acuvue.kiosk.view.CustomTextView
android:id="#+id/customTextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:layout_centerInParent="true"
android:layout_marginTop="100dp"
android:gravity="center"
android:text="#string/please_choose"
android:textSize="50sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/customTextView1"
android:layout_marginTop="100dp"
android:baselineAligned="false"
android:orientation="horizontal"
android:weightSum="2" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:textColor="#ffffff" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/hello_world"
android:textColor="#ffffff" />
</LinearLayout>
</LinearLayout>
Try this way,hope this will help you to solve your problem.
Here use LinearLayout with weight instead of Relativelayout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="#string/app_name"
android:scaleType="fitXY"
android:src="#drawable/image1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<com.acuvue.kiosk.view.CustomTextView
android:id="#+id/customTextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/please_choose"
android:textSize="50sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:textColor="#ffffff" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:textColor="#ffffff" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Related
This is continuation from my previous question. Layout is changed as given below:
<?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="match_parent"
android:layout_height="match_parent"
android:background="#color/black_70_opacity"
android:weightSum="100"
tools:context="com.dell.eventapp.ui.activity.HomeActivity">
<LinearLayout
android:id="#+id/top_image"
android:layout_width="match_parent"
android:layout_height="#dimen/img_height"
android:background="#drawable/activity_background"
android:contentDescription="#string/top_image"
android:orientation="horizontal"
android:scaleType="centerCrop"
android:weightSum="25">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center"
android:paddingBottom="#dimen/margin_8dp"
android:text="#string/cio_summit_monaco_2015"
android:textColor="#android:color/white"
android:textSize="#dimen/large_font" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_image"
android:layout_below="#id/top_image"
android:orientation="vertical"
android:weightSum="65">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="160sp"
android:layout_marginStart="#dimen/margin_20dp"
android:layout_marginTop="#dimen/margin_30dp"
android:orientation="horizontal"
android:weightSum="2">
<TextView
android:id="#+id/agenda"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="#dimen/margin_20dp"
android:layout_weight="1"
android:background="#drawable/activity_background"
android:gravity="center|bottom"
android:paddingBottom="#dimen/margin_10dp"
android:text="#string/agenda"
android:textColor="#android:color/white"
android:textSize="#dimen/medium_font" />
<TextView
android:id="#+id/sessions"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="#dimen/margin_20dp"
android:layout_weight="1"
android:background="#drawable/activity_background"
android:gravity="center|bottom"
android:paddingBottom="#dimen/margin_10dp"
android:text="#string/sessions"
android:textColor="#android:color/white"
android:textSize="#dimen/medium_font" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="160sp"
android:layout_marginStart="#dimen/margin_20dp"
android:layout_marginTop="#dimen/margin_30dp"
android:orientation="horizontal"
android:weightSum="2">
<TextView
android:id="#+id/speaker"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginRight="#dimen/margin_20dp"
android:layout_weight="1"
android:background="#drawable/activity_background"
android:gravity="center|bottom"
android:paddingBottom="#dimen/margin_10dp"
android:text="#string/speakerbio"
android:textColor="#android:color/white"
android:textSize="#dimen/medium_font" />
<TextView
android:id="#+id/venues"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_20dp"
android:layout_weight="1"
android:background="#drawable/activity_background"
android:gravity="center|bottom"
android:layout_gravity="center"
android:paddingBottom="#dimen/margin_10dp"
android:text="#string/venues"
android:textColor="#android:color/white"
android:textSize="#dimen/medium_font" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/bottom_image"
android:layout_width="match_parent"
android:layout_height="#dimen/img_height1"
android:layout_alignParentBottom="true"
android:background="#drawable/activity_background"
android:contentDescription="#string/top_image"
android:scaleType="centerCrop"
android:weightSum="10">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center"
android:paddingBottom="#dimen/margin_8dp"
android:text="#string/home_content"
android:textColor="#android:color/white"
android:textSize="#dimen/large_font" />
</RelativeLayout>
</RelativeLayout>
In root Relativelayout, I've used android:weightSum="100", in top Linearlayout, I've used android:weightSum="25". In 2nd LinearLayout, I've used android:weightSum="65". In nested LinearLayout, I've used android:weightSum="2". In 3rd LinearLayout, I've used android:weightSum="2". In bottom RelativeLayout, I've used android:weightSum="10". Resulting UI is as given below:
Custom layouts used aren't spaced evenly at top and bottom. How can I do that by using android:weightsum and android:layout_weight?
Please have a look. I hope it will work for you.
<?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">
<ImageView
android:id="#+id/imageview_1"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:background="#33000000"
android:src="#android:drawable/ic_menu_gallery" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageview_1"
android:gravity="center"
android:text="CIO Summit Monaco 2015"
android:textColor="#000000"
android:textSize="18sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/imageview_2"
android:layout_below="#+id/imageview_1"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageview_11"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1"
android:background="#33000000"
android:src="#android:drawable/ic_menu_gallery" />
<ImageView
android:id="#+id/imageview_12"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1"
android:background="#33000000"
android:src="#android:drawable/ic_menu_gallery" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageview_21"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1"
android:background="#33000000"
android:src="#android:drawable/ic_menu_gallery" />
<ImageView
android:id="#+id/imageview_22"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="1"
android:background="#33000000"
android:src="#android:drawable/ic_menu_gallery" />
</LinearLayout>
</LinearLayout>
<ImageView
android:id="#+id/imageview_2"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:background="#33000000"
android:src="#android:drawable/ic_menu_gallery" />
</RelativeLayout>
I have a beginner knowledge in android I am trying to design a screen like below
my design is not work perfectly in landscape mode.I want to overcome this problem I don't know how to rectify this.
What I am trying......
<?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">
<RelativeLayout
android:id="#+id/rL"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#mipmap/lay10"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/frame">
<LinearLayout
android:id="#+id/linearfromdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|center"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="From Date"
android:textColor="#color/list_background"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_below="#+id/linearfromdate"
android:layout_marginTop="20dp"
android:layout_marginLeft="2dp">
<EditText
android:id="#+id/fromDate"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:background="#drawable/edittext_round"/>
</LinearLayout>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/frame2"
android:layout_marginLeft="2dp"
android:layout_toRightOf="#id/frame1">
<LinearLayout
android:id="#+id/lineartodate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_gravity="top|center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="To Date"
android:textColor="#color/list_background"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear1"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<EditText
android:id="#+id/todate"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:background="#drawable/edittext_round" />
</LinearLayout>
</FrameLayout>
<FrameLayout
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/frame2"
android:layout_marginLeft="2dp"
android:id="#+id/frame3"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lineardigit"
android:orientation="horizontal"
android:layout_gravity="top|center"
android:layout_marginTop="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Digit"
android:textColor="#color/list_background"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear3"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal"
android:background="#drawable/edittext_round"
>
<Spinner
android:id="#+id/digitspinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
</FrameLayout>
<FrameLayout
android:layout_width="80dp"
android:layout_height="wrap_content"
android:id="#+id/frame4"
android:layout_marginRight="3dp"
android:layout_marginLeft="2dp"
android:layout_toRightOf="#+id/frame3">
<LinearLayout
android:id="#+id/lineartime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_gravity="top|center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Time"
android:textColor="#color/list_background"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#drawable/edittext_round"
android:orientation="horizontal">
<Spinner
android:id="#+id/timespinner"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</FrameLayout>
<FrameLayout
android:layout_width="200dp"
android:layout_height="wrap_content"
android:id="#+id/frame5"
android:layout_toStartOf="#+id/rL"
android:layout_below="#id/frame1"
android:layout_toLeftOf="#id/frame4"
android:layout_marginLeft="2dp"
>
<LinearLayout
android:id="#+id/linearname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_gravity="top|center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name"
android:textColor="#color/list_background"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#drawable/edittext_round"
android:orientation="horizontal">
<Spinner
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</FrameLayout>
<FrameLayout
android:layout_width="80dp"
android:layout_height="wrap_content"
android:id="#+id/frame6"
android:layout_marginLeft="5dp"
android:layout_marginRight="2dp"
android:layout_below="#id/frame4"
android:layout_toRightOf="#id/frame5"
>
<LinearLayout
android:id="#+id/linearnametype"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_gravity="top|center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name Type"
android:textColor="#color/list_background"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#drawable/edittext_round"
android:orientation="horizontal">
<Spinner
android:id="#+id/nametype"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</Spinner>
</LinearLayout>
</FrameLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="30dp"
android:id="#+id/frame7"
android:layout_marginRight="2dp"
android:layout_marginLeft="2dp"
android:layout_marginTop="15dp"
android:layout_toRightOf="#id/frame6"
android:layout_below="#id/frame4">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Go"
android:background="#drawable/edittextstyle"
/>
</FrameLayout>
</RelativeLayout>
<LinearLayout
android:id="#+id/linearweb"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/rL"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/webView">
</WebView>
</LinearLayout>
</RelativeLayout>
I want to reduce the extra space in landscape mode.It works perfectly in portrait mode.I am trying my best with beginner knowledge.
Try it
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#mipmap/lay10">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="4">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="From Date"
android:textColor="#color/list_background"
android:textSize="10sp" />
<EditText
android:id="#+id/fromDate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/edittext_round" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="To Date"
android:textColor="#color/list_background"
android:textSize="10sp" />
<EditText
android:id="#+id/todate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/edittext_round" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="Digit"
android:textColor="#color/list_background"
android:textSize="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/edittext_round">
<Spinner
android:id="#+id/digitspinner"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="Time"
android:textColor="#color/list_background"
android:textSize="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/edittext_round">
<Spinner
android:id="#+id/timespinner"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="4">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="Name"
android:textColor="#color/list_background"
android:textSize="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/edittext_round">
<Spinner
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="Name Type"
android:textColor="#color/list_background"
android:textSize="10sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/edittext_round">
<Spinner
android:id="#+id/nametype"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:layout_weight="1"
android:background="#drawable/edittextstyle"
android:text="Go" />
</LinearLayout>
</LinearLayout>
<WebView
android:id="#+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
You can create a new layout for your application when it's in landscape mode. Meaning you can arrange all your components again to have a better fit by placing them at different positions or possibly using other layouts.
Here's a nice udacity course you might be interested in:
Material design for android course. The entire course is about making your app look great across multiple devices different layouts.
Some links of interest:
Supporting Different Screens
Android portrait and landscape example
Hope this helped and good luck :)
Create different layout for diffrent orientation.
When you have only layout/main.xml then by default Android will render same layout file for both orientation.
If you want your layout to look different for landscape mode then create one more layout specifically for landscape mode.
For that create a folder layout-land/ and put your landscape layout inside that folder.
So your final folder structure will look like this
Here is the official documentation for Creating different layouts
Stackoverflow on same problem
I'm trying to center a button in the middle of other two buttons. I tried using weight but with no luck (Android Studio keep saying that there's an error), using layout_marginRight is not a good idea because it's not resolution independent.
Here's my XML code I hope it can help you understanding my problem.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/app_bar_main"
tools:context=".MainActivity">
<TextView
android:text="Hello World!"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_bottom"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:background="?attr/colorPrimary"
android:layout_alignParentBottom="true"
android:minHeight="?attr/actionBarSize" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="center">
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/bottom_LeftButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Lft"
android:layout_alignParentLeft="true" />
<Button
android:id="#+id/bottom_LeftCenterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="LftC"
android:layout_alignParentLeft="true" />
<Button
android:id="#+id/bottom_CenterButtom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Cnt" />
<Button
android:id="#+id/bottom_RightCenterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RhtC"
android:layout_alignParentRight="true" />
<Button
android:id="#+id/bottom_RightButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Rht"
android:layout_alignParentRight="true" />
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.Toolbar>
<LinearLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/bottom_LeftButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Lft"
android:layout_weight="1"
android:layout_alignParentLeft="true" />
<Button
android:id="#+id/bottom_LeftCenterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="LftC"
android:layout_weight="1"
android:layout_alignParentLeft="true" />
<Button
android:id="#+id/bottom_CenterButtom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Cnt" />
<Button
android:id="#+id/bottom_RightCenterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RhtC"
android:layout_weight="1"
android:layout_alignParentRight="true" />
<Button
android:id="#+id/bottom_RightButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Rht"
android:layout_weight="1"
android:layout_alignParentRight="true" />
</LinearLayout>
To keep all the buttons in of same size you need to to keep the width attribute to "fill_parent". Below is the working xml. weightsum should be equal to the number of buttons you want to use.
<RelativeLayout 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="wrap_content"
android:orientation="horizontal"
android:weightSum="4">
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>
Use Linear layout then you include "WEIGHT"to your Button,because weight belongs to linearlayout.
I currently have code that allows me to divide the screen into four equal parts, with an image button in each part. However, the code uses linear layouts which brings up the suggestion "nested weights are bad for performance". How can I make my layout using relative layouts?
Below is the code, and here is a picture of the intended format
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0"
android:orientation="horizontal"
android:background="#ff191919">
<ToggleButton
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff414141"
android:layout_weight="1.0"
android:text="Plane"
android:layout_margin="5dp"
android:textSize="20sp"
android:onClick="airplaneClicked"/>
<ImageButton
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff414141"
android:layout_weight="1.0"
android:layout_margin="5dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_brightness"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0"
android:orientation="horizontal"
android:background="#ff191919">01
<ImageButton
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff414141"
android:layout_weight="1.0"
android:layout_margin="5dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_sound" />
<ImageButton
android:id="#+id/settingsbutton"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff414141"
android:layout_weight="1.0"
android:layout_margin="5dp"
android:scaleType="fitCenter"
android:src="#drawable/settings2"/>
</LinearLayout>
</LinearLayout>
Using below xml:
<?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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#242425"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#d5d5d5" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#d5d5d5"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#d5d5d5"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#242425"
android:gravity="center"
android:orientation="vertical" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#d5d5d5" />
</LinearLayout>
</LinearLayout>
Try this code for your RelativeLayout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/r1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:id="#+id/r3"
android:layout_width="match_parent"
android:layout_height="225dp"
android:layout_marginBottom="10dp"
android:layout_alignParentTop="true" >
<ImageButton
android:id="#+id/i1"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#drawable/ic_launcher" />
<ImageButton
android:id="#+id/i2"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/ic_launcher" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/r2"
android:layout_width="match_parent"
android:layout_height="225dp"
android:layout_alignParentBottom="true"
android:layout_below="#+id/r3" >
<ImageButton
android:id="#+id/i3"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#drawable/ic_launcher" />
<ImageButton
android:id="#+id/i4"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/ic_launcher" />
</RelativeLayout>
</RelativeLayout>
Try this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_green_light"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0"
android:orientation="horizontal" >
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_blue_light"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_red_light"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>
In my app I have one layout to show text on top, image in center and then text in bottom. But now I want to try add Images of left arrow on left side and right arrow on right side in center of the image layout. Because I am using swipe in activity.
Following is my xml code and what I have tried. I want to use weight if it is possible.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/light" >
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="#dimen/txt"
android:textColor="#FFFFFF"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
android:orientation="vertical" >
/////////////////////////I have tried this
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="1">
<ImageView android:layout_width="35dp"
android:layout_height="45dp"
android:layout_gravity="center|left"
android:background="#drawable/left"/>
<ImageView android:layout_width="35dp"
android:layout_height="45dp"
android:layout_gravity="center|right"
android:background="#drawable/right"/>
</LinearLayout>
///////////////////////////////////////
</LinearLayout>
<View
android:id="#+id/top_space"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:background="#null"
android:gravity="center"
android:layout_weight=".5" />
<LinearLayout
android:id="#+id/layout3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2.5"
android:orientation="vertical" >
<com.info.abc.TextViewEx
android:id="#+id/textView2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:scrollbars="vertical"
android:textColor="#FFFFFF"
android:textSize="#dimen/betxt"/>
</LinearLayout>
</LinearLayout>
Try this..
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="1">
<ImageView
android:layout_width="0dp"
android:layout_height="45dp"
android:layout_weight="0.2"
android:layout_gravity="center"
android:src="#drawable/left"/>
<ImageView android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.6"
android:layout_gravity="center"
android:src="#drawable/yourimage"/>
<ImageView
android:layout_width="0dp"
android:layout_height="45dp"
android:layout_weight="0.2"
android:layout_gravity="center"
android:src="#drawable/right"/>
</LinearLayout>
OR
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal" >
<ImageView
android:layout_width="35dp"
android:layout_height="45dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:src="#drawable/left" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/yourimage" />
<ImageView
android:layout_width="35dp"
android:layout_height="45dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:src="#drawable/right" />
</RelativeLayout>
</LinearLayout>
I would suggest using a RelativeLayout for your need.
Try this with Using RelativeLayout
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="5"
android:orientation="horizontal" >
<ImageView
android:layout_width="35dp"
android:layout_height="45dp"
android:layout_centerVertical="true"
android:background="#drawable/ic_launcher" />
<ImageView
android:layout_width="35dp"
android:layout_height="45dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#drawable/ic_launcher" />
</RelativeLayout>
I have changed your LinearLayout with the RelativeLayout and made its gravity to center and set the images to left and right and it done.
Just change your layout android:id="#+id/layout2" with RelativeLayout as below:
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="center" >
<ImageView
android:layout_width="35dp"
android:layout_height="45dp"
android:layout_gravity="center"
android:layout_alignParentLeft="true"
android:background="#drawable/left" />
<ImageView
android:layout_width="35dp"
android:layout_height="45dp"
android:layout_gravity="center"
android:layout_alignParentRight="true"
android:background="#drawable/right" />
</RelativeLayout>
</LinearLayout>
You can use Relative layout like:-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:id="#+id/yourTextItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_centerInParent="true"
android:layout_marginBottom="20dp" >
<Button
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
>
</Button>
<Button
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
>
</Button>
</RelativeLayout>
</RelativeLayout>
layout design using weight
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="gaesh"
android:textColor="#4FFFFF"
android:textSize="14sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="8"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:src="#drawable/yout image "
android:background="#123456" />
<ImageView
android:layout_width="0dp"
android:layout_weight="8"
android:layout_height="match_parent"
android:layout_gravity="center|right"
android:src="#drawable/yout image "
android:background="#334343" />
<ImageView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:layout_gravity="center|right"
android:src="#drawable/yout image "
android:background="#654321" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/layout3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical" >
<com.info.abc.TextViewEx
android:id="#+id/textView2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#FFFFFF"
android:textSize="14sp" />
</LinearLayout>