Develop Reference

How i set ListView below match_parent Layout

mLayout :
ListView
i want to set mChartView to match_parent (fit screen)
and then add ListView below mChartView
but this only show mChartView
i try set fixed size to mChartView and ListView is work !. but i can't set mChartView to fit another screen size.
my mChartView and ListView using ScrollView
(code below it's work but mChart not match_parent because fixed size)
<ScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tv_units"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="30dp"
android:text="#string/label_data_baht"
android:textColor="#color/white"
android:textSize="16sp" />
<LinearLayout
android:id="#+id/ll_chart"
android:layout_width="match_parent"
android:layout_height="400dp" // fixed size
android:layout_margin="10dp"
android:orientation="vertical">
<com.github.mikephil.charting.charts.BarChart
android:id="#+id/mBarChart"
android:layout_width="match_parent"
android:layout_height="match_parent">
</com.github.mikephil.charting.charts.BarChart>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right">
<ImageView
android:layout_width="18dp"
android:layout_height="8dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
android:background="#drawable/bg_ic_saving" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tv_saving"
android:textColor="#ffffff"
android:textSize="13sp" />
<ImageView
android:layout_width="18dp"
android:layout_height="8dp"
android:layout_marginLeft="22dp"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
android:background="#drawable/bg_ic_expense"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="33dp"
android:text="#string/tv_expense"
android:textColor="#ffffff"
android:textSize="13sp" />
</LinearLayout>
</RelativeLayout>
<ListView
android:id="#+id/BillListYearly"
android:layout_width="match_parent"
android:layout_height="400dp" // fixed size
android:layout_marginTop="20dp"
android:layout_marginLeft="3dp"
android:layout_marginRight="3dp"
android:layout_gravity="center_horizontal"
android:focusable="false">
</ListView>
</LinearLayout>
</ScrollView>
thank you.
(I apologize for not being word-perfect in English)

Add property android:layout_weight="1" to LinearLayout of your chart view.
Also make it match_parent for height attribute,
make your ListView match_parent for height attribute.

How can I achieve overlapping card views inside Recycler view?

Basically what I need is overlap the views
View to achieve
Each cardview is an item and will be contained within a recyclerview
this is how my card view is defined
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_marginTop="-11dp">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbars="none"
android:layout_centerInParent="true"
android:layout_alignParentBottom="true"
>
<android.support.v7.widget.CardView...>
</ScrollView>
<ImageView
android:layout_width="70dp"
android:layout_height="40dp"
android:src="#drawable/img_food_little"
android:layout_alignParentEnd="true"
android:layout_marginEnd="40dp"
/>
</RelativeLayout>
And looks like (The blue one is the RelativeLayout):
How my item card view
Please Help

Try to replace the linear layout in the following with cardview and use the resultant layout as the layout for the recyclerview items .
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="top"
android:layout_marginTop="20dp"
android:background="#cccccc"
android:layout_height="100dp">
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:src="#mipmap/ic_launcher"
android:layout_gravity="right"
android:layout_marginRight="20dp"
android:layout_height="wrap_content" />
</FrameLayout>
Hope this helps.

RecyclerView Item Template

I have been struggeling the last 2 hours to get the layout of an RecycleView working the way I want it to. Basically all I want is that three items of the RecycleView fit onto one screen width, like this: Example
Where each of the boxes contains the image.
This is what it currently produces:
Current State
This is what I got:
listitem.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:cardCornerRadius="4dp"
app:cardMaxElevation="2dp"
app:cardElevation="1dp"
android:layout_centerInParent="true"
android:weightSum="3">
<GridLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnCount="4"
android:rowCount="5"
android:layout_weight="1">
<ImageView
android:layout_column="0"
android:layout_columnSpan="4"
android:layout_row="0"
android:layout_rowSpan="5"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="centerCrop"
android:id="#+id/image_view"
android:src="#drawable/ic_launcher_background"/>
<Space
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="0"
android:layout_column="0"
android:layout_columnWeight="4"
android:layout_rowWeight="2"
android:layout_gravity="center" />
<CustomFontTextView
android:layout_row="3"
android:layout_rowSpan="1"
android:layout_column="0"
android:layout_columnSpan="4"
android:layout_gravity="left"
android:gravity="left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Canada"
android:id="#+id/name"
android:textColor="#fff"
android:layout_marginLeft="20dp"
android:textSize="20dp"
android:autoSizeTextType="uniform"
android:autoSizeMinTextSize="24dp"
android:autoSizeMaxTextSize="48dp"/>
<Space
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_row="3"
android:layout_column="0"
android:layout_columnWeight="4"
android:layout_rowWeight="2"
android:layout_gravity="center" />
<CustomFontTextView
android:layout_row="4"
android:layout_rowSpan="1"
android:layout_column="0"
android:layout_columnSpan="4"
android:layout_gravity="left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Canada"
android:gravity="left"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:id="#+id/description"
android:layout_marginTop="10dp"
android:textColor="#8Fffffff"
android:layout_marginBottom="10dp"
android:autoSizeTextType="uniform"
android:textSize="16dp"
android:autoSizeMinTextSize="18dp"
android:autoSizeMaxTextSize="24dp"/>
</GridLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
And the activity:
<android.support.constraint.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"
tools:context="activities.MainActivity"
android:background="#f2f2f2">
<android.support.v7.widget.RecyclerView
android:layout_marginTop="100dp"
android:layout_marginBottom="100dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/recyclerView"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
</android.support.constraint.ConstraintLayout>
That is almost what I wanted but the items are now sized based on the length of the description. Instead I want the description to wrap if needed. Can someone elaborate on why this is happening an how to fix it?

why this is happening
You set the width of the RelativeLayout as wrap content. It makes the widh wrapped to the content as the name suggest.
How to fix it
You have to change it to a fixed value, say 200dp.
Here are some other things I have noticed in the provided layout:
You should consider using "match_parent" instead of "fill_parent" because it is deprecated since API level 8.
layout_centerInParent="true" have no effect in the CardView because it is already filled to the parent
Remove the line weightSum="3" in the CardView because it won't work on RelativeLayout

RelativeLayout- android:layout_centerHorizontal="true" and android:layout_centerVertical="true" dont center the imageview

For some strange reason android:layout_centerHorizontal="true" and android:layout_centerVertical="true" dont center the ImageView don't seem to center my ImageView
Any suggestions?
The image is stuck in the upper right left hand corner of the screen and it does not center as expected.
SOURCE:
*<?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="wrap_content"
android:layout_marginBottom="8sp"
android:layout_marginLeft="8sp"
android:layout_marginRight="8sp"
android:layout_marginTop="8sp"
android:background="#drawable/background"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/emblem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/apn_app_logo" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/start2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="8sp"
android:layout_toRightOf="#id/start" >
<Button
android:id="#+id/go_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#drawable/apn_app_go_button" />
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/go_button"
android:layout_marginRight="8sp"
android:layout_marginTop="8sp"
android:gravity="center"
android:text="#string/start_text"
android:textColor="#000000"
android:textSize="18sp" />
</RelativeLayout>
</RelativeLayout>*

Move the centerHorizontal to the relative layout. Currently, you are centering the image in the image view (basically you are centering the image in the view), what you want is the relative layout to have the contents centered.
Try:
<RelativeLayout
android:id="#+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true">
<ImageView
android:id="#+id/emblem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/apn_app_logo" />
</RelativeLayout>
The other option is to do:
<RelativeLayout
android:id="#+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:id="#+id/emblem"
android:layout_width="match_parent" //change to match_parent
android:layout_height="match_parent" //change to match_parent
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/apn_app_logo" />
</RelativeLayout>
The second option sets the width and height of the imageView to match the relativeView, which would allow you to use the centerHorizontal and centerVertical in the imageView

You can't use android:layout_below in a LinearLayout. You could put these two items in a RelativeLayout, or you could change your LinearLayout from "horizontal" to "vertical" as follows:
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_horizontal"
android:orientation="vertical" >

How do I change the background color for a column of my Android app

My Android app has a table with seven columns. I'd like to change the background color of these columns when the content in the table is updated. How do I specify columns in the main.xml and how do I change their background color? Thanks.
Edit main.xml posted...
<?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"
android:background="#CDCDCD" android:orientation="vertical">
<TableLayout android:id="#+id/tableLayout1" android:layout_width="match_parent" android:layout_height="wrap_content">
<TableRow android:id="#+id/tableRow1" android:layout_width="wrap_content" android:layout_height="wrap_content">
<TextView android:text="100" android:id="#+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="1"></TextView>
<TextView android:text="100" android:id="#+id/textView3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="2"></TextView>
<TextView android:text="100" android:id="#+id/textView4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="3"></TextView>
<TextView android:text="100" android:id="#+id/textView5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="4"></TextView>
<TextView android:text="100" android:id="#+id/textView6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="5"></TextView>
<TextView android:text="100" android:id="#+id/textView7" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="6"></TextView>
<TextView android:text="100" android:id="#+id/textView8" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="7"></TextView>
</TableRow>
<TableRow android:id="#+id/tableRow2" android:layout_width="wrap_content" android:layout_height="wrap_content">
<TextView android:text="100" android:id="#+id/textView11" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="1"></TextView>
<TextView android:text="100" android:id="#+id/textView12" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="2"></TextView>
<TextView android:text="100" android:id="#+id/textView13" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="3"></TextView>
<TextView android:text="100" android:id="#+id/textView14" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="4"></TextView>
<TextView android:text="100" android:id="#+id/textView15" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="5"></TextView>
<TextView android:text="100" android:id="#+id/textView16" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="6"></TextView>
<TextView android:text="100" android:id="#+id/textView17" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_column="7"></TextView>
</TableRow>
</TableLayout>
</LinearLayout>
EDIT:
This is an example of why I want to highlight the entire column instead of the individual textviews. When I highlight the individual textviews they are different sizes so they do not expand to the width of the widest textview in that column. Unless anyone knows how to change the size of my text views to fit the size of the widest textview in each column. If anyone does know this, please post.
EDIT:
Results of adding layout_weight properties to the TableRow tag...
I also tried the same thing but added the layout_weight property to the TextView tag instead. Here is the result...

To give your textviews equal width and therefore fix your higlighting issue you should look at the layout_weight property
<?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"
android:background="#CDCDCD"
android:orientation="vertical">
<TableLayout android:id="#+id/tableLayout1" android:layout_width="match_parent" android:layout_height="wrap_content">
<TableRow
android:id="#+id/tableRow1"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.5">
<TextView android:text="100" android:id="#+id/textView2" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_column="1"></TextView>
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.5">
<TextView android:text="100" android:id="#+id/textView11" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_column="1"></TextView>
</TableRow>
</TableLayout>
</LinearLayout>
Now I'm not at my development PC so can't verify this (and fix my formatting), but it should work I'll check it later.

Maybe not the prettiest solution but you could change the background color of all the TextViews in the column.
TextView textview2 = (TextView) findViewById(R.id.textView2);
TextView textview11 = (TextView) findViewById(R.id.textView11);
textview2.setBackgroundColor(Color.RED);
textview11.setBackgroundColor(Color.RED);

I ended up using a series of nested linear layouts, a full-screen horizonal one with evenly spaced vertical ones for the columns. If I then set the TextView background to transparent, I can change the entire column background by setting the background of the column's LinearLayout.