I have the following layout file that uses a ConstraintLayout
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto">
<TextView
android:id="#+id/main_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is my header text and is long"
android:textSize="20sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<LinearLayout
android:id="#+id/vertical_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/main_header"
android:layout_marginTop="15dp"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Foo foo fo"
android:textSize="18sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="centered text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/vertical_layout"
app:layout_constraintTop_toBottomOf="#id/main_header"
/>
</android.support.constraint.ConstraintLayout>
The result is the following:
How can I make the highlighted centered text come to the center of that white space next to the vertical linear layout? (approx where the red arrow points?
Easiest way would be to constrain the top and the bottom of the TextView to the respective edges of the LinearLayout so that it's centered vertically between them, even when the LinearLayout's height changes. The horizontal constraints are fine as they are right now. The constraints for the TextView would look like this:
app:layout_constraintBottom_toBottomOf="#id/vertical_layout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/vertical_layout"
app:layout_constraintTop_toTopOf="#id/vertical_layout"
Result:
You can simply add guideline like this :
Before you look at the layout lets look on how guidelines work:
You can think of them as invisible views that won't affect your layout, from the documentation:
a guideline is a visual guide which will not be seen at runtime that is used to align other views too.
So how I did it - I created a guideline (horizontal in my case) and told him to be at 20% height of the screen - app:layout_constraintGuide_percent="0.2" and after that I connected constraint to it and now your view is centered between the top of your screen and your guidline.
<androidx.constraintlayout.widget.ConstraintLayout 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">
<TextView
android:id="#+id/main_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is my header text and is long"
android:textSize="20sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/vertical_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:orientation="vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/main_header">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Foo foo fo"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="centered text"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/vertical_layout"
app:layout_constraintTop_toBottomOf="#id/main_header" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.2" />
But , please avoid using nested views because this is not what constraintLayout is for.
Here is example for layout without nested view groups:
<androidx.constraintlayout.widget.ConstraintLayout 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">
<TextView
android:id="#+id/main_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is my header text and is long"
android:textSize="20sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView11"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="Foo foo fo"
android:textSize="18sp"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toEndOf="#+id/textView8"
app:layout_constraintStart_toStartOf="#+id/textView8"
app:layout_constraintTop_toBottomOf="#+id/textView8" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp"
app:layout_constraintBottom_toTopOf="#+id/textView11"
app:layout_constraintEnd_toEndOf="#+id/textView10"
app:layout_constraintStart_toStartOf="#+id/textView10"
app:layout_constraintTop_toBottomOf="#+id/textView10" />
<TextView
android:id="#+id/textView10"
android:layout_width="wrap_content"
android:layout_height="24dp"
android:layout_marginStart="8dp"
android:text="Bar bar bar"
android:textSize="18sp"
app:layout_constraintBottom_toTopOf="#+id/textView8"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/main_header" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="centered text"
app:layout_constraintBottom_toTopOf="#+id/guideline3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#id/main_header" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.2" />
It is a constraint layout do it with adding a constraint at the top of the text view. Check out this https://developer.android.com/training/constraint-layout to know details about how constraint layout work.
Just added marginTop and solved your prooblem
Here is your layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<TextView
android:id="#+id/main_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is my header text and is long"
android:textSize="20sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<LinearLayout
android:id="#+id/vertical_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/main_header"
android:layout_marginTop="15dp"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Foo foo fo"
android:textSize="18sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bar bar bar"
android:textSize="18sp"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:text="centered text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/vertical_layout"
app:layout_constraintTop_toBottomOf="#id/main_header" />
</android.support.constraint.ConstraintLayout>
Here is the image
Related
So I have 3 fields to get user input from and a button. When i try to move them the "centerinParent = true" inserts automatically even when i turn it off. I want to move those fields where I want (I use relative layout) and they just wont move What should I do?
activity code :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity">
<EditText
android:id="#+id/numar_secunde_work"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginStart="36dp"
android:layout_marginTop="224dp"
android:ems="10"
android:hint="nr secunde workout"
android:inputType="number"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btn_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="false"
android:layout_centerInParent="true"
android:layout_marginStart="41dp"
android:layout_marginBottom="236dp"
android:text="Start Workout"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent" />
<EditText
android:id="#+id/numar_repetitii"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/btn_start"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_centerInParent="true"
android:layout_marginStart="105dp"
android:layout_marginTop="249dp"
android:layout_marginBottom="50dp"
android:ems="10"
android:hint="nr repetitii"
android:inputType="number" />
<EditText
android:id="#+id/numar_pauza"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginStart="103dp"
android:layout_marginTop="191dp"
android:ems="10"
android:hint="nr secunde pauza"
android:inputType="number" />
</RelativeLayout>
So i have a bottom navigation bar and in one of them it holds a tablayout consists of 3 tabs. Like the below image:
The Tablayout is inside a fragment, where it's not scrollable
The second issue other than not scrollable is, it doesn't fit the screen. Here is the android studio UI with blueprint image. (Please do compare with previous image and you will see the right most helloworld is not fitting in the screen and also couple of hello world is not scrollable!)
Tab Layout's Fragment not fitting the screen!
Partial of my home_fragment.xml
<?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="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tool"
>
<com.google.android.material.tabs.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMaxWidth="0dp"
app:tabMode="fixed"
app:tabPaddingBottom="-1dp"
app:tabPaddingEnd="-1dp"
app:tabPaddingStart="-1dp"
app:tabPaddingTop="-1dp"
app:layout_scrollFlags="scroll|enterAlways">
</com.google.android.material.tabs.TabLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tablayout"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</LinearLayout>
And here is my Category.xml (where it doesn't fit the screen)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="88dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="280dp"
android:layout_marginLeft="280dp"
android:layout_marginTop="56dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="136dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="188dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="188dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="78dp"
android:text="YYYYYYYYYYYUU"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="48dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="156dp"
android:layout_marginLeft="156dp"
android:layout_marginTop="56dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="200dp"
android:layout_marginLeft="200dp"
android:text="Hello World"
android:textSize="22dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
I have tried almost all StackOverflow question regarding this problem, but nothing did work for me!May be i just screwed up somewhere, as i am a noob programmer! Any help good people?
I have a fragment with two horizontal Buttons (yellow = fragment_test_button_container) at the bottom of my fragment. I would like to use the remaining area (red = fragment_test_scrollview) for a ScrollView It is reuiqred that my ScrollView consist of one layout (turquoise = fragment_test_check) only . This can then in turn have further layouts, as you can see in the attached fragment_test.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
tools:context=".ui.TestFragment">
<ScrollView
android:id="#+id/fragment_test_scrollview"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#id/fragment_test_button_container"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent=".84"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="#+id/fragment_test_check"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/fragment_test_front_photo_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".28"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_front_photo_title"
style="#style/myapp_MediumTextStyle"
android:layout_width="#dimen/myapp_test_fragment_textview_width"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp"
android:text="#string/fragment_test_front_photo_title_text" />
<ImageView
android:id="#+id/fragment_test_front_photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/fragment_test_back_photo_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".28"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_back_photo_title"
style="#style/myapp_MediumTextStyle"
android:layout_width="#dimen/myapp_test_fragment_textview_width"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp"
android:text="#string/fragment_test_back_photo_title_text" />
<ImageView
android:id="#+id/fragment_test_back_photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical" />
</LinearLayout>
<!-- ADDITIONAL DATA -->
<LinearLayout
android:id="#+id/fragment_test_data_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".34"
android:orientation="vertical"
android:paddingStart="24dp"
android:paddingEnd="24dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_value1_label"
style="#style/myapp_MediumTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text=„Value1^“ />
<TextView
android:id="#+id/fragment_test_value1_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_value2_label"
style="#style/myapp_MediumTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text=„Value2“ />
<TextView
android:id="#+id/fragment_test_value2_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_value3_label"
style="#style/myapp_MediumTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Ausstellungsdatum" />
<TextView
android:id="#+id/fragment_test_value3_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/fragment_test_button_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingStart="24dp"
android:paddingEnd="24dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/fragment_test_scrollview">
<Button
android:id="#+id/fragment_test_back_button"
style="#style/myapp_ContinueBackButtonStyle"
android:layout_width="0dp"
android:layout_height="#dimen/myapp_continueBackButton_height"
android:layout_weight="1"
android:background="#color/myapp_colorPrimary"
android:text=„back“
android:textColor="#FFFFFF" />
<Button
android:id="#+id/fragment_test_next_button"
style="#style/myapp_ContinueBackButtonStyle"
android:layout_width="0dp"
android:layout_height="#dimen/myapp_continueBackButton_height"
android:layout_marginStart="24dpVerySmall"
android:layout_weight="1"
android:background="#color/myapp_colorPrimary"
android:text="continue"
android:textColor="#FFFFFF" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
But my turqoise (fragment_test_check) area is not aligned fully with the blue area (fragment_test_scrollview), altough I wrote match_parent. I would like the heigth of turqoise area as the blue area.
Why is my turqoise area dangling in half the blue area?
Set android:fillViewport="true" in your ScrollView.
fillViewport stretches the content's height to the viewport's boundaries, when set true. In simple words, fillViewport decides whether the nested contents of the layout should match the parent's boundaries or not. Thus, to make the nested layout match the parent's boundary, set fillViewport to true
Moreover, the layout_gravity for nested components should be 1 or whatsoever you define in weight_sum of parent layout, whereas in your case it is 0.90 .
Scroll view of center aligned linear layout is wrapping top content in small resolution devices as well as landscape mode too.
but when i removed the center_vertical in linear lay out it is working fine, but i want that linear layout to be in center_vertical only.
Below is my code:!
<ScrollView
android:id="#+id/bodyscrollview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:fillViewport="true" >
<LinearLayout
style="#style/app_update_alert_bg"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_gravity="center_vertical"
android:layout_marginBottom="5dp"
android:orientation="vertical" >
<TextView
style="#style/app_update_alert_bg_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/updateinfo1" />
<TextView
style="#style/app_update_alert_bg_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/updateinfo2" />
<ImageView
style="#style/margin5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/switching_image_border"
android:src="#drawable/switching_image_sb" />
<ImageView
style="#style/margin5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/switching_image_border"
android:src="#drawable/switching_image_ucc" />
<CheckBox
android:id="#+id/chckbox_dontshow_again"
style="#style/margin5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/custom_checkbox"
android:text="#string/updateinfo_dontshow" />
<Button
android:id="#+id/btn_updatealert_confirmation"
style="#style/buttonStyle.signInButton"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"
android:text="OK" />
</LinearLayout>
</ScrollView>
Try this way,hope this will help you to solve your problem.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center">
<ScrollView
android:id="#+id/bodyscrollview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<LinearLayout
style="#style/app_update_alert_bg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
style="#style/app_update_alert_bg_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/updateinfo1" />
<TextView
style="#style/app_update_alert_bg_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/updateinfo2"
android:layout_marginTop="5dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/switching_image_border"
android:src="#drawable/switching_image_sb"
android:layout_marginTop="5dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/switching_image_border"
android:src="#drawable/switching_image_ucc"
android:layout_marginTop="5dp"/>
<CheckBox
android:id="#+id/chckbox_dontshow_again"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/custom_checkbox"
android:text="#string/updateinfo_dontshow"
android:layout_marginTop="5dp"/>
<Button
android:id="#+id/btn_updatealert_confirmation"
style="#style/buttonStyle.signInButton"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:text="OK" />
</LinearLayout>
</ScrollView>
</LinearLayout>
So here is the basic layout I'm after: http://i.imgur.com/Y5rHEpc.jpg
In the designer, I can't get the rectangle left-aligned how I want it. Everything just overlaps. http://i.imgur.com/ufWmVgR.png
What would be the best way to lay this out? I'm new and having a really tough time figuring out these layouts. I'm using an extremely simple rectangle shape that I created in my drawables folder.
Any tips appreciated.. I'm really banging my head against the wall here.
<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:padding="5dp"
tools:context=".MainActivity" >
<ImageView
android:id="#+id/row_rectimage"
android:layout_width="44dp"
android:layout_height="match_parent"
android:src="#drawable/rectangle" />
<TextView
android:id="#+id/row_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Some Title"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/row_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/row_title"
android:layout_marginTop="5dp"
android:text="Some Description"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="16sp" />
.....
This adds another nested LinearLayout but the performance loss should be negligible.
<?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="wrap_content"
android:orientation="horizontal"
android:padding="5dp" >
<ImageView
android:id="#+id/row_rectimage"
android:layout_width="44dp"
android:layout_height="match_parent"
android:src="#drawable/rectangle" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:paddingLeft="5dp" >
<TextView
android:id="#+id/row_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Some Title"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/row_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/row_title"
android:layout_marginTop="5dp"
android:text="Some Description"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>