I have a PieChart that is working perfectly. However, I need to have more content - EditText, Texviews, and Buttons, below the PieChart. I want the users to be able to scroll down and see different content.
I have a RelativeLayout inside of a LinearLayout whose orientation is vertical but nothing shows.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.github.mikephil.charting.charts.PieChart
android:id="#+id/pie_chart"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click me"
/>
</LinearLayout>
Put your LinearLayout under ScrollView. It should work.
In your chart, make height to wrap_content.
It should look something like this:
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.github.mikephil.charting.charts.PieChart
android:id="#+id/pie_chart"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click me"
/>
</LinearLayout>
</ScrollView>
Related
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 5 button with an ImageView inside RelativeLayout and giving some margin to each of view from the top. But margin from top does not working in my condition.
My code is :
<?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" >
<LinearLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true">
<fragment
android:name="motorpool.orbitsysindia.com.motorpool.model.splash.view.fragment.FragmentHeaderLineColor"
android:layout_width="match_parent"
android:tag="#string/fragment_header"
android:layout_height="wrap_content">
</fragment>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="20dp"
android:layout_alignParentTop="true"
android:layout_below="#+id/header">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageCar"
android:layout_centerHorizontal="true"
android:src="#drawable/mu7"/>
<motorpool.orbitsysindia.com.motorpool.util.custom.ButtonBold
android:id="#+id/btnJointInsp"
style="#style/ButtonTextMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/imageCar"
android:layout_marginTop="20dp"
android:text="#string/menuJointInsp" />
<motorpool.orbitsysindia.com.motorpool.util.custom.ButtonBold
android:id="#+id/btnVehRec"
style="#style/ButtonTextMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btnJointInsp"
android:layout_marginTop="200dp"
android:text="#string/menuVehicleRec" />
<motorpool.orbitsysindia.com.motorpool.util.custom.ButtonBold
android:id="#+id/btnRecIns"
style="#style/ButtonTextMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btnVehRec"
android:layout_marginTop="20dp"
android:text="#string/menuRecIns" />
<motorpool.orbitsysindia.com.motorpool.util.custom.ButtonBold
android:id="#+id/btnPdi"
style="#style/ButtonTextMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btnRecIns"
android:layout_marginTop="20dp"
android:text="#string/menuPDI" />
<motorpool.orbitsysindia.com.motorpool.util.custom.ButtonBold
android:id="#+id/btnLocation"
style="#style/ButtonTextMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/btnPdi"
android:background="#drawable/vehicle_list"
android:text="#string/menuLocation" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#color/white"
android:gravity="center">
<fragment
android:name="motorpool.orbitsysindia.com.motorpool.model.splash.view.fragment.FragmentFooter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout="#layout/fragment_footer" />
</RelativeLayout>
</RelativeLayout>
Any kind of help is Appreciated by me:
Problem android:layout_alignParentTop
If true, makes the top edge of this view match the top edge of the
parent. Accommodates top margin.
You should remove android:layout_alignParentTop="true" property .
EDIT
It is really just a bug of the RelativeLayout, so you could try to
wrap the RelativeLayout inside of a LinearLayout and set the margin
there.
Source .
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="20dp"
android:layout_alignParentTop="true"
android:layout_below="#+id/header">
Please remove android:layout_alignParentTop="true" from this relative layout
I have the following code:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/activity_list_films">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back"
android:onClick="back"/>
</LinearLayout>
</ScrollView>
</LinearLayout>
However the button, and the stuff that I add to the inner LinearLayout dynamically, all appear on the top left of the screen. What am I doing wrong?
I have tried putting layout_gravity="center" and gravity="center" in the inner LinearLayout too, but this does not help.
Thanks.
Your LinearLayout width is wrap_content : it doesn't take the whole width of the screen and cannot center content horizontally. So change it to android:layout_width="match_parent" also set layout_gravity to center_horizontal android:layout_gravity="center_horizontal"
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/activity_list_films"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="back"
android:text="Back" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Try this
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity = "center"
android:gravity="center"
android:id="#+id/activity_list_films">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back"
android:onClick="back"/>
</LinearLayout>
</ScrollView>
Please set width -> match_parent of LinearLayout
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"<!--change this one -->
android:layout_height="wrap_content"
android:id="#+id/activity_list_films">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back"
android:onClick="back"/>
</LinearLayout>
Otherwise you can set you LinesrLayout in center. It will be in center of your ScrollView.
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/activity_list_films"
android:gravity="center">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back"
android:onClick="back"/>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:fillViewport="true"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:id="#+id/activity_list_films">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back"
android:onClick="back"/>
</LinearLayout>
</ScrollView>
</LinearLayout>
You are missing fillViewPort for ScrollView
You not need to change Height of your Linear Layout inside Scroll View.
If you do that the content inside Scroll View will not scroll.
You just need to give android:layout_gravity="center_horizontal" inside Linear Layout other than keep all the same.
Follow below Layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/activity_list_films"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="back"
android:text="Back" />
</LinearLayout>
</ScrollView>
</LinearLayout>
The following should show a scrollview that takes up the entire screen except for a small portion large enough for a button at the bottom. When I run this the button/layout does not show up at all. Only the scrollview which takes up the entire screen with other views I have within the scrollview. Thoughts?
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.th3ramr0d.armybodyfatcalculator.MainActivity"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 1"
/>
</LinearLayout>
</LinearLayout
This will do the job for you
<RelativeLayout android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:context="com.th3ramr0d.armybodyfatcalculator.MainActivity"
xmlns:tools="http://schemas.android.com/tools"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_above="#+id/myButton">
</ScrollView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 1"
android:layout_alignParentBottom="true"
android:id="#+id/myButton" />
</RelativeLayout>
I am currently using a linear layout structure that looks as follows:
The associated xml code is as follows:
<?xml version="1.0" encoding="utf-8"?>
<com.handmark.pulltorefresh.library.PullToRefreshLoadMoreScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/altercolor2"
android:layout_gravity="top">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:baselineAligned="true">
<LinearLayout
android:id="#+id/columnOne"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight=".53"
android:orientation="vertical">
<include
android:id="#+id/first_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/item_header" />
<LinearLayout
android:id="#+id/first_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight=".47"
android:orientation="vertical">
<include
android:id="#+id/second_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/item_header" />
<LinearLayout
android:id="#+id/second_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="top" />
<include
android:id="#+id/third_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/item_header" />
<LinearLayout
android:id="#+id/third_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" />
</LinearLayout>
</LinearLayout>
</com.handmark.pulltorefresh.library.PullToRefreshLoadMoreScrollView>
However, I would like to rearrange that so that it looks like:
Is there a way I can rearrange the same with linearlayout? or do I have to use some other form of layout like relativelayout. I am pretty confused about the same. Also, would like to include the headers with the containers(the include code), is there a way I can easily achieve this?
Thanks!
After altering a code a bit, i had a little success moving the second header and second layout on top, but the first header is next to first layout instead on top, and same for third.Is there a way to fix it? I have attached the image here:
and the code is as follows:
<com.handmark.pulltorefresh.library.PullToRefreshLoadMoreScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/altercolor2"
android:layout_gravity="top">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:baselineAligned="true">
<LinearLayout
android:id="#+id/columnOne"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
android:id="#+id/second_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/item_header" />
<LinearLayout
android:id="#+id/second_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:baselineAligned="true">
<include
android:id="#+id/first_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
layout="#layout/item_dashboard_header" />
<LinearLayout
android:id="#+id/first_container"
android:layout_width="match_parent"
android:layout_weight="0.50"
android:layout_height="wrap_content"
android:orientation="vertical"
/>
<include
android:id="#+id/third_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
layout="#layout/item_dashboard_header" />
<LinearLayout
android:id="#+id/third_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
android:orientation="vertical" />
</LinearLayout>
</LinearLayout>
</com.handmark.pulltorefresh.library.PullToRefreshLoadMoreScrollView>
Something like this should get you close to what you want. Use the same amount of weight for the two Views to take up equal amounts of space. This is obviously pseudocode for the layout because it seems you know the properties.
<LinearLayout
android:orientation="vertical"
...>
<SecondView
width="match_parent"
height="wrap_content"
.../>
<LinearLayout
width="match_parent"
height="wrap_content"
...>
<LinearLayout
width="0dp"
height="wrap_content"
layout_weight="1"
orientation="vertical">
<include
android:id="#+id/first_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
layout="#layout/item_dashboard_header" />
<LinearLayout
android:id="#+id/first_container"
android:layout_width="match_parent"
android:layout_weight="0.50"
android:layout_height="wrap_content"
android:orientation="vertical"
/>
</LinearLayout>
<LinearLayout
width="0dp"
height="wrap_content"
layout_weight="1"
orientation="vertical">
<include
android:id="#+id/third_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
layout="#layout/item_dashboard_header" />
<LinearLayout
android:id="#+id/third_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
android:orientation="vertical" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
When you use weight in a horizontal LinearLayout your width should be "0dp" and in a vertical LinearLayout your height should be "0dp".
Now wrap these
<include
android:id="#+id/first_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.50"
layout="#layout/item_dashboard_header" />
<LinearLayout
android:id="#+id/first_container"
android:layout_width="match_parent"
android:layout_weight="0.50"
android:layout_height="wrap_content"
android:orientation="vertical"
/>
in a vertical LinearLayout as I have above with ThirdView and FirstView. In whatever order you need them.
Use a RelativeLayout and it's really easy -
Just use Android:Layout_AlignToRightOf="#id/LeftView"
and Android:Layout_AlignBelow="#id/TopView" for the various views.
Ie: Your xmxl for your second pic should be:
<RelativeLayout
android:id="#+id/Organize"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout //or Whatever type of view you want
android:id="#+id/Second"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<include.../>
</LinearLayout>
<LinearLayout //or Whatever type of view you want
android:id="#+id/First"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/Second">
<include.../>
</LinearLayout>
<LinearLayout //or Whatever type of view you want
android:id="#+id/Third"
androidlayout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/Second"
android:layout_ToRightOf="#id/First>
<include.../>
</LinearLayout>
</RelativeLayout>
In your first pic, and your original MXML, you have created a LinearLayout and set it to horizontal (left to right) and then put a second LinearLayout after (to the right of) it. Inside that second one, you have populated it with two items, that get distributed top to bottom. Using RelativeLayout is personal preference, but it makes controlling where you want things to appear on the screen a little more straightforward.