I want to have the following layout :
But when I run the code the first linear layout which contains a relative layout and an image is shown correctly.
Then there is the "view pager" but it is not on the screen.
and then there is a text box and a button which are there too.
So why my view pager is missing?
<?xml version="1.0" encoding="utf-8"?>
<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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
tools:ignore="NestedWeights,ContentDescription" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="5" >
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:src="#drawable/sp_page_name"
tools:ignore="ContentDescription" />
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:padding="#dimen/product_views_horizontal_padding"
tools:ignore="NestedWeights" >
</RelativeLayout>
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager_sharepoint"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:contentDescription="#string/TODO"/>
<TextView
android:id="#+id/sharepoint_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/sharepoint_description"
tools:ignore="SelectableText" />
<ImageButton
android:id="#+id/sp_more_info"
android:layout_width="70dp"
android:layout_height="30dp"
android:background="#drawable/more_info_icon"
android:layout_gravity="left"
android:onClick="sp_more"/>
</LinearLayout>
</ScrollView>
The height of your ViewPager is android:layout_height="wrap_content".
So if your ViewPager doesn't contain other views, it won't be visible.
Well, I found out that scrolling views do not work very good together.
For my layout I solve the problem by changing the height and width of the viewpager to static sizes. Actually I defined some different sizes in my dimen.xml files for different screen sizes and use them for the height and width of my view pager.
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
tools:ignore="NestedWeights,ContentDescription" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="5" >
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:src="#drawable/sp_page_name"
tools:ignore="ContentDescription" />
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:padding="#dimen/product_views_horizontal_padding"
tools:ignore="NestedWeights" >
</RelativeLayout>
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager_sharepoint"
android:layout_width="#dimen/viewpager_width"
android:layout_height="#dimen/viewpager_height"
android:contentDescription="#string/TODO"/>
<TextView
android:id="#+id/sharepoint_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/sharepoint_description"
tools:ignore="SelectableText" />
<ImageButton
android:id="#+id/sp_more_info"
android:layout_width="70dp"
android:layout_height="30dp"
android:background="#drawable/more_info_icon"
android:layout_gravity="left"
android:onClick="sp_more"/>
</LinearLayout>
</ScrollView>
Related
The list of things expected in the outout
1.a linear layout to the buttom of the activity as shown in the expected image
2.a recycler view above the linear layout to achieve the scrolling funtionality as shown in the expected image
The problem can be solved if I give the height to the recycler view.But in this case the layout won't be responsive to the samller sized screens
How can I achieve it?
xmlfile.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"
xmlns:numberpicker="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:orientation="vertical"
tools:context=".CartPage">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:padding="20dp">
<ImageView
android:id="#+id/back_icon"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:src="#drawable/ic_arrow_back_black_24dp" />
<TextView
android:id="#+id/product_buy"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_marginLeft="20dp"
android:layout_toRightOf="#+id/back_icon"
android:fontFamily="#font/carter_one"
android:text="My Cart"
android:textColor="#color/black"
android:textSize="20sp"
tools:ignore="RtlCompat" />
</RelativeLayout>
<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">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/product_recycler"
android:layout_width="match_parent"
android:layout_height="400sp"
android:padding="0dp" />
// this is the buttom recycler
<LinearLayout
android:layout_alignParentBottom="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/buttom"
android:gravity="bottom|end"
android:layout_gravity="bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_gray"
android:orientation="vertical"
android:padding="5dp">
<TextView
android:id="#+id/details"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_gray"
android:fontFamily="sans-serif"
android:lineHeight="28dp"
android:padding="5dp"
android:text="Price Details"
android:textColor="#color/grey_400"
android:textSize="18sp"
tools:ignore="RtlCompat" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
If you wish to tell your RecyclerView to fill the left over space of your LinearLayout you have to use the following layout_height and layout_weight on your RecyclerView:
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/product_recycler"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:padding="0dp" />
So, I have the following .xml:
<?xml version="1.0" encoding="utf-8"?>
<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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.scopesystems.cityalert.ui.Despre"
tools:showIn="#layout/app_bar_despre"
android:background="#drawable/toolbar_incercare">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/linear_parent">
<RelativeLayout
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.1" />
<RelativeLayout
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="2.8" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!--General-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/sectionHeader"
android:text="#string/general"
/>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/despre_general"/>
<!--Evaluti-ne-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/sectionHeader"
android:text="#string/evaluatine"
/>
<!--Confidentialitate si licente-->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/sectionHeader"
android:text="#string/confidentialitate"
/>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/despre_politici"/>
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.1" />
</LinearLayout>
</ScrollView>
The issue is that the last ListView is on only 1 row, and it has to be scrolled to display all the items in the list. I tried to add to the linear_parent a height of match_parent but it wont let me, it says that I should use instead wrapcontent. How can i change the layout to display the items on all the screen, not just half?
In this case, On the ScrollView use android:fillViewport="true" and for child of ScrollView android:height="wrap_content".
I have created a layout. But at the bottom there is a white space left. I want the content of the relative layout at the extreme bottom of the screen. i.e seekbar and button at the bottom.
<?xml version="1.0" encoding="utf-8"?>
<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"
android:background="#drawable/images">
<com.example.acer.myapplication.ZoomView
android:id="#+id/iop"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<SeekBar
android:id="#+id/seekBar7"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/button61"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_below="#id/seekBar7"
android:layout_centerInParent="true"
android:background="#drawable/play" />
</RelativeLayout>
</LinearLayout>
I want the white space at the bottom should be replaced with the content of relative layout.
I have uploaded the image
use this code:
<?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="wrap_content"
android:orientation="vertical"
android:background="#drawable/images">
<com.example.acer.myapplication.ZoomView
android:id="#+id/iop"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
>
<SeekBar
android:id="#+id/seekBar7"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="#+id/button61"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_below="#id/seekBar7"
android:layout_centerInParent="true"
android:background="#drawable/play" />
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
instead of wrap_content You should put match_parent.
That would help it out. I hope you know about wrap_content and match_parent.If you don't look at this
https://developer.android.com/reference/android/view/ViewGroup.LayoutParams.html
I am struggling with my Android Layout.
I want to create a Linear Layout which contains a Button at the Top, next a List View and when all elements of the list view are displayed I want to show a Fragment which displays Google Maps.
This is my Layout xml file. In that case you can only see the Fragment and the Button but not the listview
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:orientation="vertical"
tools:context="de.mypackage.MyActivity">
<Button
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:id="#+id/button_back"
android:text="#string/back"
/>
<ListView
android:id="#+id/list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"/>
/>
<fragment
android:id="#+id/fragement"
android:name="de.mpackage.MapsFragment"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
tools:layout="#layout/fragment_maps"/>
</LinearLayout>
Any Idea how I can realize my layout?
Try this 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"
android:paddingLeft="10dp"
android:weightSum="1"
android:paddingRight="10dp">
<Button
android:id="#+id/button_back"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/back" />
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5" />
<fragment
android:id="#+id/fragement"
android:name="com.yougotag.supplierfieldagent.fragments.AboutFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
tools:layout="#layout/fragment_about_app" />
</LinearLayout>
this will set both in half screen you can change ration of weights in layout.
Advice :
Declare your root layout as RelativeLayout
RelativeLayout is a view group that displays child views in relative
positions. The position of each view can be specified as relative to
sibling elements .
Then use android:layout_below
Positions the top edge of this view below the given anchor view ID.
Accommodates top margin of this view and bottom margin of anchor view.
<fragment
android:id="#+id/fragement"
android:name="de.mpackage.MapsFragment"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_below="#+id/birth"
tools:layout="#layout/list"/>
Try this 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"
android:paddingLeft="10dp"
android:paddingRight="10dp">
<Button
android:id="#+id/button_back"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/back" />
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<fragment
android:id="#+id/fragement"
android:name="com.yougotag.supplierfieldagent.fragments.AboutFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout="#layout/fragment_about_app" />
</LinearLayout>
Try this :
<?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="wrap_content"
android:layout_height="fill_parent"
android:paddingLeft="10dp"
android:paddingRight="10dp"
tools:context="de.mypackage.MyActivity">
<Button
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:id="#+id/button_back"
android:text="#string/back"
/>
<ListView
android:id="#+id/list"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_weight="1"
android:layout_below="#+id/button_back"/>
/>
<fragment
android:id="#+id/fragement"
android:name="de.mpackage.MapsFragment"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:layout_below="#+id/list"
tools:layout="#layout/fragment_maps"/>
</RelativeLayout>
I found a solution hope it helps.
In my ListView for the height instead of using 0dp I used wrap_content and adds layout_weight=1 for my Fragment
<LinearLayout
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:background="#EFEFEF"
android:orientation="vertical">
<Button
android:id="#+id/button_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:divider="#null"/>
<fragment
android:name="de.mpackage.MapsFragment"
android:id="#+id/fragement"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="5dp"
android:layout_weight="1"
/>
</LinearLayout>
I'm trying to design something like that :
Currently i'm having issue putting the button at "the middle" of the two layouts reunion point. Is there a way i do this ?
Thanks.
Here is a way to do it
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#FF0000">
<!-- TO ADD CONTENT HERE -->
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#FFFF00"
android:weightSum="0.5">
<!-- TO ADD CONTENT HERE -->
</LinearLayout>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#000000"
android:text="TEST"
android:textColor="#FFFFFF"/>
</RelativeLayout>
OUTPUT:
You can change the layout height from android:layout_weight="0.5"
you can use RelativeLayout for your parent and try adding twoLinearLayouts , one below another and set their heights, now place a Button in your RelativeLayout and set android:layout_centerInParent="true" for your Button .
and if you want to use weight for layouts, instead of adding two LinearLayout to your RelativeLayout, add one LinearLayout with weightSum=100 and then add two LinearLayouts to it with custom weights.
for your case , you have to do sth like this :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="20"
android:background="#f00" >
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="80"
android:background="#0f0" >
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="100" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="20" >
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="test" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>