How to prevent layout moving?

How to prevent layout moving? - android

I have one main layout in my quiz game and in it 3 more nested layout, one below another, vertical. In the top one I have a text view for the question, the middle one with four buttons vertically arranged. Now, when I have one line question everything is fine, but as soon as question goes to two line, my buttons move down one row. How to prevent this? I want everything below my question to be fixed, static, not to move.
<?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:background="#drawable/background"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="404dp"
android:orientation="vertical"
android:weightSum="2"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1" >
<TextView
android:id="#+id/tvPitanje"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="#string/tvPitanje"
android:textSize="22sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1" >
<Button
android:id="#+id/bOdgovor1"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/buttons"
android:text="#string/bOdgovor1"
android:textSize="26sp" />
<Button
android:id="#+id/bOdgovor2"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:background="#drawable/buttons"
android:text="#string/bOdgovor2"
android:textSize="26sp" />
<Button
android:id="#+id/bOdgovor3"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:background="#drawable/buttons"
android:text="#string/bOdgovor3"
android:textSize="26sp" />
<Button
android:id="#+id/bOdgovor4"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:background="#drawable/buttons"
android:text="#string/bOdgovor4"
android:textSize="26sp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
<Button
android:id="#+id/bIzlazIzKviza"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="15dp"
android:background="#drawable/buttons"
android:text="#string/bIzlazKviz"
android:textSize="23sp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/tvCountdown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="#string/tvCountdown"
android:textColor="#ff0000"
android:textSize="29sp" />
<TextView
android:id="#+id/tvSkor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="#string/tvSkor"
android:textSize="23sp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
<TextView
android:id="#+id/tvBrojPitanja"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="30dp"
android:text="1"
android:textSize="32sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

A little later, but here we go, there are several solutions for this problem I will point out here two of them that probably are the most user friendly:
Use a scrollview for everything, IMHO this is the most user friendly solution.
Use scrollview just for text and buttons with a defined height, and put the below text and buttons static underneath, make use of a relative layout then.
Marquee text view
the first option I will put out here, with some layout refactoring included, the second one I wont recommend to use, put pretty simple to achieve if you have example one:
<?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:background="#android:color/background_light"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tvPitanje"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="long text that will automaticly scroll and make sure all content will be displayed right in the scrollview this is the best case scenario"
android:textSize="22sp"/>
<Button
android:id="#+id/bOdgovor1"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:text="one"
android:textSize="26sp"/>
<Button
android:id="#+id/bOdgovor2"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="two"
android:textSize="26sp"/>
<Button
android:id="#+id/bOdgovor3"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="three"
android:textSize="26sp"/>
<Button
android:id="#+id/bOdgovor4"
android:layout_width="260dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="four"
android:textSize="26sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/bIzlazIzKviza"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="15dp"
android:text="left"
android:textSize="23sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/tvCountdown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="next"
android:textColor="#ff0000"
android:textSize="29sp"/>
<TextView
android:id="#+id/tvSkor"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:text="middle"
android:textSize="23sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:id="#+id/tvBrojPitanja"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="30dp"
android:text="right"
android:textSize="32sp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
Marquee solution less nice
android:singleLine="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit ="marquee_forever"
android:scrollHorizontally="true"
android:focusable="true"
android:focusableInTouchMode="true"

Related

align textview below ImageView

I've one ImageView and 3 TextViews. I need to align the 3 text views below the imageview. the first on the left . the second in center. the 3rd on the right.
below code is working for normal and small screens. but for tablets and large screens, the first text view is not below the imageview. it's shifted too left. and the third TextView is shifted too Right.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Rel_wind2_img">
<ImageView
android:id="#+id/window2_image1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:id="#+id/window2_image1"/>
<TextView
android:id="#+id/TV1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
android:layout_alignParentLeft="true"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
android:layout_centerInParent="true"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
android:layout_alignParentRight="true"
android:text="#string/info2_txt_moves"
android:textAlignment="center"/>
</RelativeLayout>
I can solve this problem grammatically. but i need a simple way using XML.

Give layout weight inside a linear layout. It will set the width equally between all textviews. try this
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Rel_wind2_img"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:id="#+id/window2_image1"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
>
<TextView
android:id="#+id/TV1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_weight="1"
android:textAlignment="center"/>
<TextView
android:id="#+id/TV3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="info2_txt_moves"
android:layout_weight="1"
android:textAlignment="center"/>
</LinearLayout>
</RelativeLayout>

Best way to do this kind of UI design just divide the Layout into weights.
because if we divide the ui in weights it will automatically adjust according to divide size so there will be no problem on any device.
like:
<?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">
<RelativeLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Rel_wind2_img">
<LinearLayout
android:id="#+id/tr"
android:layout_centerHorizontal="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/window2_image1"
android:layout_width="fill_parent"
android:layout_height="20dp"
android:background="#color/black"
/>
</LinearLayout>
<LinearLayout
android:layout_below="#+id/tr"
android:weightSum="3"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/TV1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="dhshshs"
/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/TV2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="fjkhajhjfha"
/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/TV3"
android:text="aoifoijoajoifjoajofjafafg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/window2_image1"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>

Use this One :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/Rel_wind2_img"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/window2_image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="dfgf"
android:id="#+id/TV1"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAlignment="center" />
<TextView
android:id="#+id/TV2"
android:text="dfgf"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center" />
<TextView
android:id="#+id/TV3"
android:text="dfgf"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center" />
</LinearLayout>
</LinearLayout>
Hope this help you...if you need any help you can ask

not able to re center layout and keep it left justified the views present in it

So, I have a layout,and there are a couple of textviews in it,i'm trying to put all the views in the center and content of the views should be left justified,i'm not sure how to do that?
any inputs would be helpful,here's my xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:gravity="center"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:text="PTD Payments"
android:background="#android:color/transparent"
/>
<TextView
android:id="#+id/childOption1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:layout_marginLeft="50dp"
android:background="#android:color/transparent"
android:text="Option 1" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#D3D3D3"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:id="#+id/childOption12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:text="Annual TIA"
android:background="#android:color/transparent"
/>
<TextView
android:id="#+id/childOption2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:layout_marginLeft="50dp"
android:background="#android:color/transparent"
android:text="Option 2" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#D3D3D3"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:id="#+id/childOption13"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:text="Total Liability"
android:textColor="#ff0000"
android:background="#android:color/transparent"
/>
<TextView
android:id="#+id/childOption3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:layout_marginLeft="50dp"
android:background="#android:color/transparent"
android:textColor="#ff0000"
android:text="Option 3" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
It seems that relative layout works out, but I need to have some level of margin, i'm attaching an image on how it should look
I cannot share some part of the code due to privacy reasons

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:gravity="center"
android:weightSum="2"
>
<TextView
android:weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
<TextView
android:weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
</LinearLayout>

try below code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center"
android:gravity="center"
android:weightSum="2">
<TextView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
<TextView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
</LinearLayout>

how to stop components in android GUI not to overlap

I am trying to make the image button fix completely on the screen and the spinner. It seems to have a problem with the weight sum and weight layout. I have tried to fix it, but haven't gotten anywhere. This is my code:
<LinearLayout
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"
tools:context=".ElderActivity"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/first"
android:background="#ffab7c74"
android:layout_weight="1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Smart House"
android:id="#+id/textView"
android:gravity="center"
android:autoText="true"
android:textColor="#fffff7f4" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/environment"
android:layout_weight="1"
android:id="#+id/imageButton" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/law"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinner"
android:layout_weight="1" />
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinner1"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/consumer"
android:layout_weight="1"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/educations"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinner2"
android:layout_weight="1" />
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinner3"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
[screem shot of screen][1]: https://i.stack.imgur.com/tPFDi.jpg

It is very bad practice to use the weight option, especially if you have weight options in deep hierarchy of layout. For your example you need to use RelativeLayout or even TableLayout.
But if you want a mess up for your bottom part you can use tricky thing like:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<View android:id="#+id/strut"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"/>
<Button
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/text1"
android:layout_alignEnd="#id/strut"
android:layout_alignParentStart="true"
/>
<Button
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignStart="#+id/strut"
android:layout_alignParentEnd="true"
android:text="#string/text2"
/>
</RelativeLayout>

Nesting RelativeLayouts within LinearLayout

I am trying to achieve the following layout in Android with the main heading at the top and three subheadings spaced equally apart below, with some buttons below that:
I was able to accomplish this with the following XML, but I feel like I am not using the RelativeLayout and LinearLayout properly:
<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="match_parent"
android:background="#cfff"
android:orientation="vertical"
tools:context=".MainActivity">
<TextView
android:id="#+id/text_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="1"
android:text="Title"
android:textSize="80sp"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight=".5">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text_caption1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Subheading"
android:gravity="center"
android:textSize="18sp"/>
<TextView
android:id="#+id/text_number1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text_caption1"
android:text="1"
android:layout_weight="1"
android:textSize="80sp"
android:gravity="center"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text_caption2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Subheading"
android:gravity="center"
android:textSize="18sp"/>
<TextView
android:id="#+id/text_number2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text_caption2"
android:text="10"
android:layout_weight="1"
android:textSize="80sp"
android:gravity="center"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text_caption3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Subheading"
android:gravity="center"
android:textSize="18sp"/>
<TextView
android:id="#+id/text_sets"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text_caption3"
android:text="3"
android:layout_weight="1"
android:textSize="80sp"
android:gravity="center"/>
</RelativeLayout>
</LinearLayout>
<!-- Button1 -->
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:text="Button1"
android:textSize="20sp"/>
<!-- Button2 -->
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:text="Button2"
android:textSize="20sp" />
</LinearLayout>
I'm focusing somewhat on the Subheading portion, although any suggestions on the overall layout would be welcome. So I used 3 different RelativeLayouts to put the "Subheading" captions with their respective numbers, and nested those within a horizontal LinearLayout to get them spaced next to each other horizontally.
This seems to be creating a bit of a problem, since Android Studio is complaining that my use of layout_weight within nested layouts is bad for performance. When I get rid of the layout_weight however, everything falls apart and I only see the "Title" and one subheading. I'm also wondering whether I could have accomplished this more elegantly with just one RelativeLayout and no nesting, but I can't see how to code something like this without the use of a LinearLayout.
Thanks in advance for any suggestions!

Yes,you can accomplish this more elegantly with just one RelativeLayout and no nesting
I hope this is what you are looking for
<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="#cfff"
tools:context=".MainActivity">
<TextView
android:id="#+id/text_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title"
android:textSize="80sp" />
<TextView
android:id="#+id/text_caption1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/text_number1"
android:text="Subheading"
android:textSize="18sp" />
<TextView
android:id="#+id/text_number1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:gravity="left"
android:text="1"
android:textSize="80sp" />
<TextView
android:id="#+id/text_caption2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/text_number2"
android:gravity="center"
android:text="Subheading"
android:textSize="18sp" />
<TextView
android:id="#+id/text_number2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:gravity="center"
android:text="2"
android:textSize="80sp" />
<TextView
android:id="#+id/text_caption3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/text_number3"
android:gravity="right"
android:text="Subheading"
android:textSize="18sp" />
<TextView
android:id="#+id/text_number3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:gravity="right"
android:text="3"
android:textSize="80sp" />
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/button2"
android:text="Button1"
android:textSize="20sp" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Button2"
android:textSize="20sp" />
</RelativeLayout>

try this one...
<?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"
android:weightSum="10">
<TextView
android:layout_width="wrap_content"
android:layout_height="0dip"
android:layout_weight="5"
android:text="TITLE"
android:layout_gravity="center"
android:gravity="center"
android:textSize="45sp"
android:id="#+id/textView64" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:weightSum="10">
<LinearLayout
android:orientation="vertical"
android:layout_width="0dip"
android:layout_weight="3.25"
android:gravity="center"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Subheading"
android:id="#+id/textView66" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:textSize="50sp"
android:id="#+id/textView67" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="3.5"
android:gravity="center"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="SubHeading"
android:id="#+id/textView68" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
android:textSize="50sp"
android:id="#+id/textView69" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dip"
android:layout_weight="3.25"
android:gravity="center"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="SubHeading"
android:id="#+id/textView70" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="3"
android:textSize="50sp"
android:id="#+id/textView71" />
</LinearLayout>
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="0.8"
android:text="New Button"
android:id="#+id/button"
android:layout_gravity="center_horizontal" />
<Button
android:layout_width="wrap_content"
android:layout_height="0dip"
android:layout_weight="0.8"
android:text="New Button"
android:id="#+id/button1"
/>

Change android:weightSum and android:layout_weight acoording to your required ratio...
<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="match_parent"
android:background="#cfff"
android:orientation="vertical"
tools:context=".MainActivity"
android:weightSum="4">
<TextView
android:id="#+id/text_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="1.5"
android:text="Title"
android:textSize="80sp"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1.5"
android:weightSum="3">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text_caption1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Subheading"
android:gravity="center"
android:textSize="18sp"/>
<TextView
android:id="#+id/text_number1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text_caption1"
android:text="1"
android:layout_weight="1"
android:textSize="80sp"
android:gravity="center"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text_caption2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Subheading"
android:gravity="center"
android:textSize="18sp"/>
<TextView
android:id="#+id/text_number2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text_caption2"
android:text="10"
android:layout_weight="1"
android:textSize="80sp"
android:gravity="center"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text_caption3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Subheading"
android:gravity="center"
android:textSize="18sp"/>
<TextView
android:id="#+id/text_sets"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/text_caption3"
android:text="3"
android:layout_weight="1"
android:textSize="80sp"
android:gravity="center"/>
</RelativeLayout>
</LinearLayout>
<!-- Button1 -->
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button1"
android:layout_weight=".5"
android:textSize="20sp"/>
<!-- Button2 -->
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight=".5"
android:text="Button2"
android:textSize="20sp" />
</LinearLayout>

Layout weight apparently work well, but not in some real devices

I have searched and tried a lot of solution without success.
I have a full size image in the main screen of my app. So i want to organize this image with 2 buttons on the bottom of the screen.
With this XML everything seems ok but in some devices (HTC One, LG Nexus 4...) the image is not visible . In others devices is all ok and indeed i think the code is pretty good. I know that could be a weight problem but if i use relative layout there is the problem of the overlapping (i don't want use scroll view because the main screen must be all visible immediatly).
What i'm missing?
<?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"
android:background="#drawable/main_gradient">
<ImageView android:id="#+id/imgMainLogo"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:padding="20dp"
android:adjustViewBounds="true"
android:contentDescription="#string/image_description"
android:gravity="center"
android:src="#drawable/logo"/>
<LinearLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:padding="15dp"
android:gravity="bottom">
<Button
android:id="#+id/buttonRegister"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginRight="10dp"
android:padding="20dp"
android:text="#string/main_btn_register"
android:textStyle="bold"
android:textSize="18sp"
android:textColor="#FFFFFF"
android:background="#drawable/button_background"/>
<Button
android:id="#+id/buttonEnter"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginLeft="10dp"
android:padding="20dp"
android:text="#string/main_btn_enter"
android:textStyle="bold"
android:textSize="18sp"
android:textColor="#FFFFFF"
android:background="#drawable/button_background"/>
</LinearLayout>
</LinearLayout>

Checkout the weight related changes that I have made. Let me know if it works.
<?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:background="#drawable/main_gradient"
android:orientation="vertical"
android:weightSum="1" >
<ImageView
android:id="#+id/imgMainLogo"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.7"
android:adjustViewBounds="true"
android:contentDescription="#string/image_description"
android:gravity="center"
android:padding="20dp"
android:src="#drawable/logo" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.3"
android:gravity="bottom"
android:orientation="horizontal"
android:padding="15dp"
android:weightSum="1" >
<Button
android:id="#+id/buttonRegister"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="0.5"
android:background="#drawable/button_background"
android:padding="20dp"
android:text="#string/main_btn_register"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonEnter"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="0.5"
android:background="#drawable/button_background"
android:padding="20dp"
android:text="#string/main_btn_enter"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>

<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/linearLayout"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:gravity="center"
android:padding="20dp"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:orientation="horizontal"
android:padding="20dp"
android:weightSum="2" >
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:text="Register"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:text="Enter"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

How to prevent layout moving? - android

Related

align textview below ImageView

not able to re center layout and keep it left justified the views present in it

how to stop components in android GUI not to overlap

Nesting RelativeLayouts within LinearLayout

Layout weight apparently work well, but not in some real devices

Categories

Resources