Why is the scrollview going behind the button here? I want the scrollview to stretch in height depending on the device but cant get it to work as it always goes behind the button.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/detail_view"
style="#style/DetailView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical" >
<TextView
style="#style/TextView"
android:id="#+id/textview_message_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
</TextView>
<TextView
style="#style/TextView"
android:id="#+id/textview_message_date"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
</TextView>
<ScrollView
android:id="#+id/scrollview_message_text"
android:layout_height="wrap_content"
android:paddingBottom="20dip"
android:layout_width="fill_parent">
<TextView
style="#style/TextView"
android:id="#+id/textview_message_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TextView>
</ScrollView>
</LinearLayout>
<LinearLayout style="#style/DetailView.Buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
style="#style/Button"
android:layout_marginTop="5dip"
android:id="#+id/button_view_file"
android:text="#string/viewfile"/>
</LinearLayout>
</RelativeLayout>
Here is a working copy of what I think you are looking for
1: Moved the buttons to the top of the relative layout ( added an id )
android:layout_alignParentBottom="true"
<LinearLayout android:id="#+id/buttons"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="5dip"
android:id="#+id/button_view_file"
android:text="Button"/>
</LinearLayout>
2: Add in the layout containing the scroll change the width and height to match parent
but ( CRITICAL ) add android:layout_above="#id/buttons"
<LinearLayout
android:layout_above="#id/buttons"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/darker_gray"
android:gravity="center"
android:orientation="vertical" >
So putting it all together:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:id="#+id/detail_view"
>
<!-- Buttons at the top of layout but aligned to the bottom -->
<LinearLayout android:id="#+id/buttons"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="5dip"
android:id="#+id/button_view_file"
android:text="Button"/>
</LinearLayout>
<!-- Linear layout to fill screen, but assigned to layout above the buttons -->
<LinearLayout
android:layout_above="#id/buttons"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/darker_gray"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/textview_message_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
</TextView>
<TextView
android:id="#+id/textview_message_date"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
</TextView>
<ScrollView
android:id="#+id/scrollview_message_text"
android:layout_height="wrap_content"
android:paddingBottom="20dip"
android:layout_width="fill_parent">
<TextView
android:id="#+id/textview_message_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TextView>
</ScrollView>
</LinearLayout>
</RelativeLayout>
I removed the styles so I could see it in the layout an make sure this worked before posting. Hope this helps.
Relative layout allows you to layer elements on top of each other. So if that is not what you are looking for you need to make use of the toLeft, toRight, above, below directives to nudge the layouts into the correct position.
This happens because you use Relative layout as the root layout. So both layout are placed on the same place but the button layout is declared after the scrollview so it is shown above the scrollview
The opposite would happen if you were defining the button before the scrollview
So you should define it as shown below to achieve what you want.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/detail_view"
style="#style/DetailView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_above="#id/layout_bottom"
android:orientation="vertical" >
<TextView
style="#style/TextView"
android:id="#+id/textview_message_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
</TextView>
<TextView
style="#style/TextView"
android:id="#+id/textview_message_date"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
</TextView>
<ScrollView
android:id="#+id/scrollview_message_text"
android:layout_height="wrap_content"
android:paddingBottom="20dip"
android:layout_width="fill_parent">
<TextView
style="#style/TextView"
android:id="#+id/textview_message_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TextView>
</ScrollView>
</LinearLayout>
<LinearLayout
android:id="#+id/layout_bottom"
style="#style/DetailView.Buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
style="#style/Button"
android:layout_marginTop="5dip"
android:id="#+id/button_view_file"
android:text="#string/viewfile"/>
</LinearLayout>
</RelativeLayout>
or you can try and use LinearLayout as the root view and set
layout_height = "0dp"
layout_weight = "1"
to the layout containing the scrollview
using both these way will make the button stick to the bottom of the layout and the top layout will get all the remaining height.
Good Luck
Why is the scrollview going behind the button here?
Because it is coming first in your layout, ReletiveLayout and FrameLayout can be used to provide Z-ordering, So every child which comes later in your layout having higher z value so it goes up.Add android:layout_below = "#id/scrollview_message_text" to your last linearlayout or order your views within in mind of this characteristic of reletivelayout.
Related
I have a Vertical linear layout with 2 item. One is a is a customview which is extended from a framelayout and the 2nd one is a textview with a drawable as background. The visibility have to be controlled dynamically from gone to visible.
The issue is that when i change the visibility of the item from gone to visible the order is not coming as i intended. The the second item is below the customview. I want it to come as the 2nd item, below the customview
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:textureview="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:id="#+id/comment_holder"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.custom_views.CircularFrameLayout
android:id="#+id/comment_holder_circular_layout"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/user_avatar"
android:visibility="gone"
android:layout_gravity="center_horizontal"
android:layout_width="#dimen/comment_avatar_width"
android:layout_height="#dimen/comment_avatar_width" />
<com.custom_views.PlaybackTextureView
android:visibility="gone"
android:id="#+id/playback_texture_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
textureview:isAuthorMode="true"/>
</com.custom_views.CircularFrameLayout>
<LinearLayout
android:visibility="gone"
android:id="#+id/c_holder"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="8dp"
android:paddingBottom="16dp"
android:paddingStart="4dp"
android:paddingEnd="4dp"
android:background="#drawable/chat_bubble_top_arrow_orange"
android:orientation="vertical">
<TextView
android:id="#+id/video_comment_user_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
android:textColor="#color/black_50"
android:fontFamily="sans-serif" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
NOTE: I tried adding weight to the custom layout as 1. But it still didnt help.
Following code produces the result in the blueprint:
<?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:background="#drawable/marker_shape">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/marker_header">
<TextView
android:id="#+id/widget_1_header_from"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"/>
<Button
android:id="#+id/widget_1_refresh"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/quantum_ic_refresh_white_24"/>
</LinearLayout>
<ListView
android:id="#+id/widget_1_list"
android:footerDividersEnabled="false"
android:headerDividersEnabled="false"
android:layout_width="match_parent"
android:dividerHeight="0dp"
android:layout_height="wrap_content">
</ListView>
</LinearLayout>
As you can see: the TextView gets displayed beneath the Button. They need to go next to each other. How do I fix this?
You have 2 options:
Change your button's height to wrap_content.
or:
change your textview height to match_parent.
I'm trying to create a new LinearLayout and now i have added a text and a background and now the background appears and still not full as it seems in the graphical they both show up in the graphical layout
example here:
https://www.dropbox.com/s/k58uznho9pu5qky/Untitled1.png
and when i test it out in a emulator which is real device the background isn't showing probably with some white space down and the text doesn't even appear
example here:
https://www.dropbox.com/s/q9e45sunbsesrd1/uniteled3.png
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/relLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="right"
android:orientation="vertical"
tools:context=".SecondActivity" >
<LinearLayout
android:id="#+id/linearlayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/images"
android:gravity="center|right"
android:orientation="vertical" >
<TextView
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingTop="10sp"
android:text="testing ytestifnfndfijdfhffdkjdfkjfdjkj"
android:textSize="25sp" />
</LinearLayout>
</ScrollView>
How does this fit your needs? If you plan to add more content, then the root component can be ScrollView with the background. But with only one TextView, there should be no need for ScrollView unless the text is huge.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
xmlns:tools="http://schemas.android.com/tools"
android:background="#drawable/images"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".SecondActivity" >
<TextView
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="testing ytestifnfndfijdfhffdkjdfkjfdjkj"
android:textSize="25sp" />
</LinearLayout >
to fill whole screen with your layout use match_parent for layout_height and layout_width
<LinearLayout
android:id="#+id/linearlayout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/images"
android:gravity="center|right"
android:orientation="vertical" >
I have done a simple layout xml file. I have been solving my issues piece by piece. I am using scrolview, linearlayout and tableview. I have a top bar and it is locked at the top. it never moves. in the middle, I have a scrollview and I need to put my last linearlayout at the bottom as a footer and I dont want it be disappear if the user scrolls down. I want it to be locked there.
here is my code
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableRow
android:background="#drawable/gradient"
android:gravity="center">
.......
</TableRow>
</TableLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/sw_layout"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#EEEEEE" >
<TableRow
android:id="#+id/tableRowDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
..........
</TableRow>
</TableLayout>
/*****************************************/
/* I want this to be footer at the bottom*/
/*****************************************/
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/btn_date"
android:layout_height="35dp"
android:padding="5dp"
android:drawableLeft="#drawable/calendar"
android:text="Tarih" />
<Button
android:id="#+id/btn_converter"
android:layout_height="35dp"
android:padding="5dp"
android:drawableLeft="#drawable/calendar"
android:text="Hesap" />
</LinearLayout>
/*****************************************/
/* I want this to be footer at the bottom*/
/*****************************************/
</LinearLayout>
</ScrollView>
</LinearLayout>
How can I achive to have footer locked at the bottom?
You should use RelativeLayout and in the footer layout , add the tag : android:layout_alignParentBottom="true" ; and for your ScrollView , you should put it above the footer Layout ( android:layout_above="#+id/idOfYourFooterLayout" )
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="wrap_content"
android:orientation="vertical">
<ScrollView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/sw_layout"
android:layout_above="#+id/footer"
android:orientation="vertical">
//your UI...
</ScrollView>
<LinearLayout
android:id="#+id/footer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<Button
android:id="#+id/btn_date"
android:layout_height="35dp"
android:padding="5dp"
android:drawableLeft="#drawable/calendar"
android:text="Tarih" />
<Button
android:id="#+id/btn_converter"
android:layout_height="35dp"
android:padding="5dp"
android:drawableLeft="#drawable/calendar"
android:text="Hesap" />
</LinearLayout>
</RelativeLayout>
You can set the layout_height="0dp" of your header, footer and ScrollView and define a layout_weight. Just play around with the values until you find out which works best. The resulting heights of header and footer would dynamically change with the screensize.
The values 1, 5, 1 mean that the first element takes 1/7, the second 5/7 and the last 1/7 of the available height in the parent LinearLayout.
Try
<!-- HEADER -->
<TableLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<!-- BODY -->
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:id="#+id/sw_layout"
android:orientation="vertical"
android:layout_weight="5">
<!-- FOOTER -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="1" >
Use parent Layout as RelativeLayout and add this property android:layout_alignParentBottom="true" to the footer layout, and put the LinearLayout (footer layout ) out of scrollview. like 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="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" //// add this property
android:orientation="vertical" >
<Button
android:id="#+id/btn_date"
android:layout_height="35dp"
android:padding="5dp"
android:drawableLeft="#drawable/calendar"
android:text="Tarih" />
<Button
android:id="#+id/btn_converter"
android:layout_height="35dp"
android:padding="5dp"
android:drawableLeft="#drawable/calendar"
android:text="Hesap" />
</LinearLayout>
use one xml like this- >>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
</LinearLayout>
and include it as
LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
...
<!-- Overridden attributes never work. Nor do attributes like
the red background, which is specified here. -->
<include
android:id="#+id/buttons_override"
android:background="#ff0000"
android:layout_width="fill_parent"
layout="#layout/buttons"/>
</LinearLayout>
Use Relative layout as your parent layout then add your three child views as follows
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" >
<View android:id="#+id/top_view"
android:alignParentTop="true"> // Your view that as to be in Top
</View>
<ScrollView android:layout_below ="#id/top_view" > //scroll view in middle below topview
</ScrollView>
<View android:alignParentBotton="true"> //Your expected view in bottom
</View>
</RelativeLayout>
In my case, I have added these lines of code below in the Oncreate function and top of the Layout
like below
code is here:
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN)
Here's the XML code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:text="Welcome"
android:layout_centerInParent="true" android:textSize="20sp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:text="Welcome"
android:layout_centerInParent="true" android:textSize="20sp"/>
</RelativeLayout>
</RelativeLayout>
It's not really the scene (The UI design is not that code, but I'm presenting it for simplification).
What I except from this code is that the TextViews will be displayed one by another relatively (in a vertical way). Like:
Welcome
Welcome
But instead the output is the following:
Welcome
Like, they're nested together, stacked on each other.
I made the width layouts as fill parent, so why the other layout doesn't go down? it overrides the first relativelayout.
I must have 2 layouts, so please don't suggest me to create only one layout.
Thank you.
You need to set the relation of your layouts.
Try the modification I've made below.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:id="#+id/top_rel>
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:text="Welcome"
android:layout_centerInParent="true" android:textSize="20sp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/top_rel>
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:text="Welcome"
android:layout_centerInParent="true" android:textSize="20sp"/>
</RelativeLayout>
</RelativeLayout>
I've given the top layout the android:id="#+id/top_rel" to make it's identification easier.
Also I've told it to be laid out at the top of the view by using android:layout_alignParentTop="true".
The lower RelativeLayout then is being laid out below the top one by using android:layout_below="#id/top_rel".
First of all, give some id of the Relative layout corresponding the first text view. Then using the id, add the layout_below property for the second relative layout. So that it will display below of the first text view..
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent">
<RelativeLayout
android:id = "#+id/first_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:text="Welcome"
android:layout_centerInParent="true" android:textSize="20sp"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/first_layout">
<TextView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:text="Welcome"
android:layout_centerInParent="true" android:textSize="20sp"/>
</RelativeLayout>
</RelativeLayout>