I have created a fragment which displays a bunch of different text. Each time the activity is loaded the text is different. I load this fragment in main activity using a framelayout. At the bottom of my main screen I have created a buttons panel with three buttons with each performing a different action such as play and next item. The problem is that some times when the text data is big and the framelayout expands to the bottom of the screen. How can I limit Framelayout to remain above buttons panel?
In the fragment layout I have multiple TextViews nested in a ScrollView.
fragment.xml
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".fragments.TextsFragment">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/english_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="English Name"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:id="#+id/orignal_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="Original Name"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:id="#+id/translatied_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="Translated Name"
android:textAppearance="?android:textAppearanceMedium"/>
</LinearLayout>
<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:text="#string/opening_braces"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:id="#+id/number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="2"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="#string/colon"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:id="#+id/line_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="42"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/closing_braces"
android:textAppearance="?android:textAppearanceMedium"/>
</LinearLayout>
<TextView
android:id="#+id/word"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="Word"
android:textAppearance="?android:textAppearanceMedium"/>
<TextView
android:id="#+id/english_translation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
tools:text="English Translation"
android:textAppearance="?android:textAppearanceMedium"/>
</LinearLayout>
</ScrollView>
main_activity.xml
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context=".activity.MainActivity">
<FrameLayout
android:id="#+id/text_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"/>
<RelativeLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginBottom="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_alignParentBottom="true">
<ImageButton
android:id="#+id/play_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/white_play_button"
android:contentDescription="#string/play"
android:onClick="onClickPlayButton"
android:layout_alignParentStart="true"
/>
<TextView
android:id="#+id/textView3"
android:layout_width="170dp"
android:layout_height="52dp"
android:text="Random"
android:background="#drawable/border"
android:includeFontPadding="false"
android:gravity="center"
android:layout_toEndOf="#id/play_button"
android:layout_alignTop="#id/play_button"/>
<ImageButton
android:id="#+id/share_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/white_share_button"
android:contentDescription="#string/share"
android:onClick="onClickShareButton"
android:layout_toEndOf="#id/textView3" />
<ImageButton
android:id="#+id/next_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/white_next_button"
android:contentDescription="#string/next"
android:onClick="onClickNextButton"
android:layout_toRightOf="#+id/share_button"/>
</RelativeLayout>
</RelativeLayout>
Is there a way to keep framelayout just above the buttons panel at bottom instead of expanding to bottom of screen?
How can I limit Framelayout to remain above buttons panel?
You can tell the surrounding RelativeLayout to make sure the FrameLayout stays above the buttons panel by using the attribute android:layout_above for the FrameLayout
<FrameLayout
android:id="#+id/text_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_above="#+id/linearLayout"/>
See the documentation for RelativeLayout to find out more about layout attributes
Related
I have a requirement to realize a certain type of layout. These layout contains an ImageView that is part of the item layout for an horizontal RecyclerView that displays the movies that belong to a particular category.
Desired layout screenshot
My current layout screenshot
The item layout for the RecyclerView containing the ImageView and
TextView label.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="4dp"
android:background="#android:color/black">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/imageViewMediaThumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:layout_gravity="top"
android:src="#mipmap/placeholder_image" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/clientMediaThumbnailLabel"
android:orientation="vertical">
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="16dp"
android:text="Movie Name"
android:textColor="#android:color/white" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
Try this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white" >
<TextView
android:id="#+id/movieTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="32sp"
android:text=""
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="left"/>
<ImageView
android:id="#+id/movieImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#id/movieTitle" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/movieTitle"
android:layout_centerHorizontal="true"
android:id="#+id/linearLayout">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/textView"
android:layout_weight="1"
android:gravity="right" />
</LinearLayout>
I have been able to arrive at a solution through setting a layout bottom margin of 20dp for the Image View while reducing the text size of the TextView (to avoid it showing a parent layout right margin space wider than the image).
Adding the bottom margin of 20dp to the image view made the text view's text to become visible.
Here is my updated layout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="#android:color/black">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/clientMediaThumbnailLabel"
android:orientation="vertical">
<ImageView
android:id="#+id/imageViewMediaThumbnail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:layout_gravity="top"
android:src="#mipmap/placeholder_image"
android:layout_marginBottom="20dp"/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Movie Name"
android:textColor="#android:color/white"
android:textSize="10sp"
android:textStyle="bold" />
</RelativeLayout>
</android.support.v7.widget.CardView>
I have the following xml. Basically I want to display the movie overview below the Layout whose id is equals to layoutOne.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbarStyle="outsideOverlay">
<LinearLayout
android:id="#+id/layoutOne"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_horizontal"
android:padding="16dp"
android:background="#color/primary"
>
<ImageView
android:id="#+id/movie_image"
android:layout_width="160dp"
android:layout_height="240dp"
android:scaleType="fitXY"
android:layout_gravity="center_vertical"
/>
<RelativeLayout
android:layout_width="wrap_content"
android:padding="16dp"
android:layout_gravity="center_vertical"
android:layout_height="wrap_content">
<TextView
android:id="#+id/movie_title"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
/>
<TextView
android:layout_below="#+id/movie_title"
android:layout_centerHorizontal="true"
android:id="#+id/movie_rating"
android:text="9/10"
android:textSize="24sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="20dp"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_below="#+id/movie_rating"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_marginTop="13dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:drawable/ic_menu_my_calendar"/>
<TextView
android:layout_below="#+id/movie_rating"
android:layout_centerHorizontal="true"
android:id="#+id/movie_date"
android:text="2017-10-9"
android:textSize="16sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="20dp"
/>
</LinearLayout>
</RelativeLayout>
<TextView
android:id="#+id/title_overview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Great movie" />
</LinearLayout>
</ScrollView>
Here is what I get.
I want the sample text Great movie to be below that light pink layout. The tricky part here is that Scrollbar view allow only one child view. Any ideas?
Thanks,
Theo.
The Constraint of the RelativeLayout should fit the whole page. If you want to use ScrollView you should add the RelativeLayout to the ScrollView too.
Hence it would be like this :
<LinearLayout
android:id="#+id/layoutOne"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="center_horizontal"
android:padding="16dp"
android:background="#color/primary"
>
Later you can use the following to adjust the image:
<LinearLayout
android:layout_marginBottom="439dp"
android:layout_marginEnd="156dp"
android:layout_marginStart="156dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
>
I have a activity where i have some images,textview,a button and viewpager. Viewpager has height and width to match parent and all the layouts have background as white color . Now when the activity loads viewpager gets its fragments by adapter and it loads fragments. Now the images,textview are hidden behind the loaded fragments but the button does not gets hidden and its shown in fragments. Why is this happening ?
THis is my layout of activity with viewpager as last element
<?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"
tools:context="com.appointmentno.android.LogoFrontScreen"
android:background="#android:color/white"
android:keepScreenOn="true">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:id="#+id/rel_center_logo">
<ImageView
android:layout_width="#dimen/logo_width"
android:layout_height="#dimen/logo_height"
android:src="#drawable/finalc"
android:scaleType="centerInside"
android:layout_centerHorizontal="true"
android:id="#+id/img_logo_c"/>
<TextView
android:layout_width="210dp"
android:layout_height="wrap_content"
android:text="#string/logo_name"
android:layout_below="#id/img_logo_c"
android:id="#+id/app_name"
style="#style/RobotoTextViewStyle"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:textSize="#dimen/logo_text_size"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/logo_underline"
android:layout_below="#id/app_name"
android:id="#+id/app_name_underline"
style="#style/RobotoTextViewStyle"
android:textColor="#android:color/black"
android:textSize="13sp"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/txt_progress_report"
android:layout_below="#+id/rel_center_logo"
android:gravity="center"
android:layout_marginTop="50dp"
android:layout_centerHorizontal="true"
android:maxLines="10"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str_2"
android:id="#+id/btn_enter_app"
android:layout_below="#id/rel_center_logo"
android:layout_centerHorizontal="true"
android:layout_marginTop="84dp"/>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminate="true"
android:id="#+id/logo_screen_progress"
android:layout_below="#id/rel_center_logo"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:visibility="gone"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
android:id="#+id/txt_ver_alert"
android:gravity="center"/>
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager_gallery"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"/>
</RelativeLayout>
Try this:
<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"
tools:context="com.appointmentno.android.LogoFrontScreen"
android:background="#android:color/white"
android:keepScreenOn="true"
android:gravity="center">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:id="#+id/rel_center_logo"
android:orientation="vertical">
<ImageView
android:layout_width="#dimen/logo_width"
android:layout_height="#dimen/logo_height"
android:src="#drawable/finalc"
android:scaleType="centerInside"
android:layout_centerHorizontal="true"
android:id="#+id/img_logo_c"/>
<TextView
android:layout_width="210dp"
android:layout_height="wrap_content"
android:text="#string/logo_name"
android:id="#+id/app_name"
style="#style/RobotoTextViewStyle"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:textSize="#dimen/logo_text_size"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/logo_underline"
android:id="#+id/app_name_underline"
style="#style/RobotoTextViewStyle"
android:textColor="#android:color/black"
android:textSize="13sp"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:id="#+id/rel_center_logo"
android:orientation="vertical"
android:layout_below="#id/rel_center_logo">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/txt_progress_report"
android:gravity="center"
android:layout_marginTop="50dp"
android:layout_centerHorizontal="true"
android:maxLines="10"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str_2"
android:id="#+id/btn_enter_app"
android:layout_centerHorizontal="true"
android:layout_marginTop="84dp"/>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminate="true"
android:id="#+id/logo_screen_progress"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:background="#color/colorAccent"
android:textColor="#android:color/white"
android:id="#+id/txt_ver_alert"
android:gravity="center"/>
</LinearLayout>
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager_gallery"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"/>
</RelativeLayout>
I basically divided your views into to groups (according to what I believe you want) and put them into their respective LinearLayouts. So in the end you have one RelativeLayout that holds two LinearLayouts and a ViewPager.
Below is my XML code, I want the whole view to scroll, but it's just not working, please help, with what's wrong;
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/app_icon"
android:layout_marginTop="20dp"
android:layout_gravity="center_horizontal"/>
<TextView
android:id="#+id/textView_app_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_gravity="center"/>
<TextView
android:id="#+id/textView_content"
android:layout_width="match_parent"
android:layout_marginTop="15dp"
android:layout_height="386dp"
android:gravity="center"></TextView>
</LinearLayout>
</ScrollView>
I've tried using,
android:fillViewport="true"
but of no help.
A ScrollView is a FrameLayout, meaning you should place one child in it containing the entire contents to scroll; this child may itself be a layout manager with a complex hierarchy of objects.
So here you have to take LinearLayout or RelativeLayout and then you have to put different hierarchy of component.
Android : buttons not visible in scrollview
here i have given answer of Some problem so you can follow this for solve your problem with clearing your concept.
Try like this ,Scrolling will work till End
<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">
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/app_icon"
android:layout_marginTop="20dp"
android:layout_gravity="center_horizontal"/>
<TextView
android:id="#+id/textView_app_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_gravity="center"/>
<TextView
android:id="#+id/textView_content"
android:layout_width="match_parent"
android:layout_marginTop="15dp"
android:layout_height="386dp"
android:gravity="center"/>
</LinearLayout>
</ScrollView>
</Relativelayout>
If ScrollView fits to your device screen it would not be scrollable, so make sure content inside ScrollView takes space larger than your screen size.
systematix Try this,here you getting scroll.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_app_version4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:text="hello" />
<TextView
android:id="#+id/textView_content4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center"
android:text="fahfhahffshfs fsfhshf fshfs sflshf sflsh fhsfhslfh fshflshf hslfh slfhslfhslfhs fhslhf"></TextView>
</LinearLayout>
I'm trying to lay some text out on left and right that have a mirroring position as below.
What's happening here is that the last row in the right column ("Some more text") is the widest so it pushes the two rows above further to the right. For the sake of symmetry, the left column is pushed further to the left. The text values are supposed to be dynamic. Does anyone know how the layouts should be designed?
Here's my code (sadly, it doesn't even align to the right!):
<LinearLayout
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1">
<RelativeLayout android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1">
<RelativeLayout android:id="#+id/description_30"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true">
<TextView android:id="#+id/title_30"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="30 DAYS"/>
<TextView android:id="#+id/num_ds_30"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/title_30"/>
<TextView android:id="#+id/num_bs_30"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/num_ds_30"/>
</RelativeLayout>
</RelativeLayout>
<RelativeLayout android:id="#+id/description_today"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_toRightOf="#id/description_30">
<TextView android:id="#+id/title_today"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:text="TODAY"/>
<TextView android:id="#+id/num_ds_today"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_below="#id/title_today"/>
<TextView android:id="#+id/num_bs_today"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_below="#id/num_ds_today"/>
</RelativeLayout>
</LinearLayout>
You can achieve something like that by nesting LinearLayouts. The outer LinearLayout would have an orientation=horizontal, and the two inner LinearLayout an orientation of vertical with each having a layout_weight=1 and the second (right) LinearLayout would also have gravity="right".
The code would be something like this.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1">
<TextView
... />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="right">
<TextView
... />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I think using a RelativeLayout and aligning the TextViews to the left/right is a good approach. Like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/Text1_Left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true" />
<TextView
android:id="#+id/Text2_Left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/Text1_Left" />
<TextView
android:id="#+id/Text3_Left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/Text2_Left" />
<TextView
android:id="#+id/Text1_Right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/Text1_Left"
android:gravity="right" />
<TextView
android:id="#+id/Text2_Right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/Text1_Right"
android:layout_toRightOf="#id/Text2_Left"
android:gravity="right" />
<TextView
android:id="#+id/Text3_Right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/Text2_Right"
android:layout_toRightOf="#id/Text1_Left"
android:gravity="right" />
</RelativeLayout>