Develop Reference

Android XML: How to place widget below included layout

I am trying to place a chart widget (com.android.AnyChartView, #+id/piechart) from the AnyChart library (https://github.com/AnyChart/AnyChart-Android) below an included layout (#layout/content_main) that contains a TabHost. I tried giving the include an id and setting the layout_below property of the chart widget, but that has not worked. The app graph fills the entire screen, covering the Tab view.
Below is my code:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"/>
<include layout="#layout/content_main"
/>
<com.anychart.AnyChartView
android:id="#+id/piechart"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
content_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp"
android:paddingLeft="5dp"
android:paddingTop="5dp"
android:paddingRight="5dp"
android:paddingBottom="5dp"
android:background="#ffffff"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<TabHost
android:id="#+id/tab_host"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#ffffff"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/tab1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/tab2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/tab3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
</FrameLayout>
</LinearLayout>
</TabHost>
</androidx.constraintlayout.widget.ConstraintLayout>
Below is a screenshot of the app:

You need to remove your pie chart from main_activity and put it under content_main like this:
<?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">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:padding="5dp"
android:paddingLeft="5dp"
android:paddingTop="5dp"
android:paddingRight="5dp"
android:paddingBottom="5dp"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<TabHost
android:id="#+id/tab_host"
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#ffffff"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/tab1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/tab2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
<LinearLayout
android:id="#+id/tab3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
</FrameLayout>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</TabHost>
<com.anychart.AnyChartView
android:id="#+id/piechart"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintTop_toBottomOf="#+id/tab_host" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
I have added the scrollview but you can remove it if it's not in your requirements.

There are a number of possible solutions
Solution 1
On the include tag indicate android:layout_width="match_parent" and android_height="wrap_content"
<include layout="#layout/content_main"
android:layout_width="match_parent"
android_height="wrap_content"
/>
Solution 2
Using LinearLayout as the parent ViewGroup provide android:layout_weight="1" and android:layout_height="0dp" on the include tag, this will allow the content_main.xml to occupy the remaining space and yet fit on the screen.
<include layout="#layout/content_main"
android:layout_width="match_parent"
android_height="0dp"
android_layout_weight="1"
/>

ScrollView not working in a fragment

i want to make layout scrollable with scrollview but its not working at all.tried to change scrollview with NestedScrollView but the problem still same. this layout used in fragment. put LinearLayout inside the scrollview as a view. can anyone help me to correct my code if i am doing wrong ? below is my xml code
<?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:id="#+id/rootView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:background="#android:color/white"
android:orientation="vertical"
tools:context=".ui.jobCalendar.JobCalendarFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<com.applandeo.materialcalendarview.CalendarView
android:id="#+id/calendarView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:headerColor="#color/colorPrimaryDark" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bg_calendar"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary">
<TextView
android:padding="10dp"
style="#style/TextContent.Black"
android:layout_marginBottom="8dp"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:text="Schedule"
android:textColor="#color/white"
android:textSize="16sp" />
</LinearLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/listJob"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/activity_vertical_margin"
tools:listitem="#layout/job_row">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
thanks in advance

Do this
1) Change root layout to RelativeLayout
2) Set height of ScrollView to wrap_content
3) Change height of ScrollView child which is LinearLayout to
match_parent
4)add this line to Host activity of that fragment
<activity
android:name="Activity_name"
android:windowSoftInputMode="stateHidden|adjustResize" />
Finally the xml looks like:-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/rootView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:fillViewport="true"
android:orientation="vertical"
tools:context=".ui.jobCalendar.JobCalendarFragment">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:fillViewport="true"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.applandeo.materialcalendarview.CalendarView
android:id="#+id/calendarView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:headerColor="#color/colorPrimaryDark" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bg_calendar"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary">
<TextView
style="#style/TextContent.Black"
android:layout_marginBottom="8dp"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:padding="10dp"
android:text="Schedule"
android:textColor="#color/white"
android:textSize="16sp" />
</LinearLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/listJob"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/activity_vertical_margin"
tools:listitem="#layout/job_row">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</RelativeLayout>

I think you need to get rid of those settings inside the ScrollView attribute.
Basically short it down to
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
Put the rest of the settings inside a RelativeLayout that is included inside the ScrollView like this:
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
======== put all the rest of your settings from scrollvide here =====>
<CONTENT> add here the rest of your code </CONTENT>
</RelativeLayout>
</Scrollview>

The View or layout moves up when the keypad is shown

I tried for adding android:windowSoftInputMode="adjustpan" etc in my activity manifest but it didn't worked for me. This works fine in activity but not in fragment. In fragment the views are coming up with the keypad.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusableInTouchMode="true"
android:fillViewport="true"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/search_layout"
android:layout_below="#+id/view1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="horizontal">
<AutoCompleteTextView
android:id="#+id/autoCompleteTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:textSize="#dimen/txtsize_14">
</AutoCompleteTextView>
</RelativeLayout>
<ListView
android:layout_below="#+id/view2"
android:id="#+id/listView"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>

Android Design Issues on Phone and Tablet

I am new to Android and was working on designing an app. I had worked for my phone device hoping it would work on tablet (Nexus 7) too. I used view pager and frames to make tabs. But it works fine on phone and not on tablet.
The upper one is for phone and the lower one is for tablet. Please suggest what wrong I did.
Here's my activity_main.xml file:-
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".MainActivityNew"
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<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="match_parent"
android:background="#color/white"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"/>
<com.meroanswer.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start|center"
android:textAlignment="textStart"
android:elevation="2dp"
android:background="#color/primary"/>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="1">
</android.support.v4.view.ViewPager>
</LinearLayout>
<!--<android.support.v7.widget.RecyclerView
android:id="#+id/RecyclerView"
android:layout_width="320dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#ffffff"
android:scrollbars="vertical">
</android.support.v7.widget.RecyclerView>-->
<ListView
android:layout_width="260dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/windowBackgroundColor"/>
</android.support.v4.widget.DrawerLayout>
Here's tab_subject.xml file:-
<?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">
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/toolbar"
android:padding="4dp"
android:clipToPadding="false"
android:columnWidth="#dimen/item_width"
android:numColumns="auto_fit"
android:horizontalSpacing="4dp"
android:verticalSpacing="4dp"
android:stretchMode="columnWidth"/>
</RelativeLayout>
Here's my grid_items.xml file:-
<?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">
<View
android:layout_height="2dp"
android:layout_width="fill_parent"
android:background="#88cdcdcd" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:baselineAligned="false">
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.3">
<ImageView
android:id="#+id/image"
android:layout_width="40dp"
android:layout_height="40dp"
android:scaleType="centerCrop"
android:layout_marginLeft="10dp"
android:layout_gravity="center" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="0.4"
android:layout_height="match_parent"
android:layout_gravity="left"
android:gravity="center">
<TextView
android:id="#+id/subject_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Physics"
android:textSize="20dp"
android:textColor="#color/black_translucent"/>
<TextView
android:id="#+id/chapters_completed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="15dp"
android:text="50 chapters"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_weight="0.3"
android:layout_height="80dp"
android:layout_gravity="right"
android:gravity="center">
<TextView
android:id="#+id/progress_gained"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="30dp"
android:textColor="#color/progressColor"
android:padding="#dimen/spacing_large"
android:layout_gravity="center" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
The activity_main.xml file is the main activity layout, tab_subjects.xml is the layout file for the Model Exam tab currently. And then the grid_items.xml file is later added on the gridview.

Found a solution. It was because I had added fixed width on gridview as suggested by AndroidWeblineindia.

ScrollView with Button

I need result as this.
My xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include layout="#layout/background_water"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<include layout="#layout/finish_order_content"/>
</ScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/sendOrder"
android:text="Оформить заказ"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="8dp"
android:background="#drawable/btn_orange"/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
If ScrollView have a very long content then Button not show (I see only ScrollView). How to fix it?

You can do something like below. Add android:layout_above="#id/sendOrder" to ScrollView to make it appear above the button and set its height fill_parent to fill the available space.
I'm not sure how <include layout="#layout/background_water"/> should work though as you haven't included it in the picture above.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:id="#+id/sendOrder"
android:text="Оформить заказ"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="8dp"
android:background="#drawable/btn_orange"/>
<include layout="#layout/background_water"/>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/sendOrder">
<include layout="#layout/finish_order_content"/>
</ScrollView>
</RelativeLayout>

// try this way
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/background_water"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/finish_order_content"/>
</ScrollView>
</LinearLayout>
<Button
android:id="#+id/sendOrder"
android:text="Оформить заказ"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="8dp"
android:background="#drawable/btn_orange"/>
</LinearLayout>

Try this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include layout="#layout/background_water"/>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<include layout="#layout/finish_order_content"/>
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/footer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="0dp"
android:gravity="center"
android:orientation="vertical"
android:padding="5dp" >
<Button
android:id="#+id/sendOrder"
android:text="Оформить заказ"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="8dp"
android:background="#drawable/btn_orange"/>
</LinearLayout>
</FrameLayout>
</LinearLayout>

The below should work. I took the liberty of removing unnecessary Views. Not sure what background_water actually is, but if it is supposed to be used as background, just remove your include (and the android:layout_below part I added to your ScrollView), and use android:background on the main RelativeLayout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include layout="#layout/background_water"
android:id="#+id/include_layout"/>
<Button
android:id="#+id/sendOrder"
android:text="Оформить заказ"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="8dp"
android:background="#drawable/btn_orange"/>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/sendOrder"
android:layout_below="#id/include_layout">
<include layout="#layout/finish_order_content"/>
</ScrollView>
</RelativeLayout>

Just try this once ,put below code in xml file and view its preview .
I hope this will help u or atleast provides u a clue :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/button"
android:layout_marginBottom="10dip"
android:background="#bb9789" >
</ScrollView>
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#ff6790"
android:gravity="center"
android:text="Button" />
</RelativeLayout>
value of
activity_vertical_margin
is
16dip