Develop Reference

Unable to set equal row heights in ListView

I have a problem. I created a ListView with a custom adapter. Therefore I created a new Layout for just 1 row. In that layout I set the main layout to a height of 120dp, but when the list gets created all the rows are not equal and for my opinion not 120dp. Here is the code of the row layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="120dp"
android:minWidth="0px"
android:minHeight="50px"
android:background="#edf0f4">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="70"
android:layout_height="match_parent"
android:background="#edf0f4"
android:id="#+id/LayoutSettingName">
<TextView
android:text="Dark Theme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/txtSettingName"
android:textColor="#000000"
android:autoSizeMaxTextSize="20dp"
android:autoSizeMinTextSize="17dp"
android:autoSizeTextType="uniform"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:textStyle="bold" />
<TextView
android:text="Change the theme to something more dark"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/txtSettingDescription"
android:textColor="#666666"
android:autoSizeMaxTextSize="18dp"
android:autoSizeMinTextSize="16dp"
android:autoSizeTextType="uniform"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_weight="30"
android:layout_height="match_parent"
android:background="#edf0f4"
android:id="#+id/LayoutSettingValue"
android:gravity="center">
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#dddddd"
android:textColor="#FFFFFF"
android:id="#+id/SettingEditText" />
<Spinner
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/SettingSpinner" />
<Switch
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="25px"
android:minHeight="25px"
android:id="#+id/SettingSwitch" />
</LinearLayout>
</LinearLayout>
Here is a screenshot of the ListView I have right now:
I want to rows to be double the size of the first row, but it doesn't matter which size I give them, they always look like this.
What am I doing wrong?

If you go back through the source code you can see that ListView will call makeAndAddView(... ) to get the View, and in this method, the obtainView method of the parent AbsListView is called, which generates an AbsListView.LayoutParams of MATCH_PARENT width and WRAP_CONTENT height,so the height you set in the item XML doesn't take effect because the ListView defaults to LayoutParams for each item
you could change by the following two ways：
1.Nest the layout in the XML one more time:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="120dp"
android:background="#edf0f4"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="70"
android:layout_height="match_parent"
android:background="#edf0f4"
android:id="#+id/LayoutSettingName">
<TextView
android:text="Dark Theme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/txtSettingName"
android:textColor="#000000"
android:autoSizeMaxTextSize="20dp"
android:autoSizeMinTextSize="17dp"
android:autoSizeTextType="uniform"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:textStyle="bold" />
<TextView
android:text="Change the theme to something more dark"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/txtSettingDescription"
android:textColor="#666666"
android:autoSizeMaxTextSize="18dp"
android:autoSizeMinTextSize="16dp"
android:autoSizeTextType="uniform"
android:layout_marginLeft="2dp"
android:layout_marginRight="2dp" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_weight="30"
android:layout_height="match_parent"
android:background="#edf0f4"
android:id="#+id/LayoutSettingValue"
android:gravity="center">
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#dddddd"
android:textColor="#FFFFFF"
android:id="#+id/SettingEditText" />
<Spinner
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/SettingSpinner" />
<Switch
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minWidth="25px"
android:minHeight="25px"
android:id="#+id/SettingSwitch" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
2.Manually set an abslistview.layoutparams for convertView in the getView method in Adapter
public override View GetView(int position, View convertView, ViewGroup parent)
{
...
convertView = LayoutInflater.From(parent.Context).Inflate(Resource.Layout.layout6, null);
convertView.setLayoutParams(new AbsListView.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT, 300));//300 is your custom height
...
}

Fixing image in center of toolbar Android

I am working whit Xamarin pcl. Now has the Android project an auto rendered layout for Toolbar and Tabbar. I am customizing the toolbar.axml to have a icon in the center of it. Everything is going wel untill a page got a back button (navigation page attribute I guess) end the icon shifts to the right because its not anymore the only one in the toolbar. Is there an easy fix to give the icon a fixed position? The back-button, I think, is not declared in an axml but generated through the function of Xamarin.Forms new NavigationPage().
My axml looks now like this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#72B1A2"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light"
>
<ImageView
android:id="#id/image"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:layout_gravity="center"
android:baselineAlignBottom="true"
android:scaleType="fitCenter"
android:src="#drawable/ictzaak_FC"
/>
</android.support.v7.widget.Toolbar>
I already look into the use of android:layout_gravity="center" and android:layout_gravity="center_horizontal" and android:center_horizontal or something but it didn't fix it
How it looks:
Startup screen without the return button
With return button and out of center

You can try to nest the Image in a RelativeLayout. And in this you can center your Image. Like this:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#72B1A2"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#id/image"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:layout_centerInParent="true"
android:baselineAlignBottom="true"
android:scaleType="fitCenter"
android:src="#drawable/ictzaak_FC"
/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>

Image set in center using LinearLayout.
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_height="match_parent">
<ImageView
android:id="#id/image"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/ic_img"/>
</LinearLayout>
</android.support.v7.widget.Toolbar>

Scaling a View in axml or c#

Currently I am trying to create a little app with mainly a horizontalscrollview and a main view. The horizontalscrollview contains a linearlayout with a bunch of BoxItems defined in my BoxItem.axml file. One BoxItem is also displayed on the main view.
The Problem is that I need to shrink the items in order to fit the scrollview. I would like the items to automatically resize (with all its child views) to fit the parentview (in height).
If it is possible I would also like to implement a function the set the size in code (but that’s not my main concern).
BoxItem.axml:
<?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:id="#+id/Box"
android:gravity="center_vertical">
<TextView
android:text="Shelf"
android:id="#+id/Shelf"
android:textColor="#009900"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="30sp" />
<TextView
android:text="ProductName"
android:id="#+id/Name"
android:textColor="#009900"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="30sp" />
<TextView
android:text="Barcode"
android:id="#+id/Barcode"
android:textColor="#009900"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="30sp" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout3"
android:gravity="center">
<TextView
android:text="10"
android:id="#+id/StockCurrent"
android:textColor="#009900"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textSize="30sp" />
<TextView
android:text="/"
android:id="#+id/textView4"
android:textColor="#009900"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textSize="30sp" />
<TextView
android:text="10"
android:id="#+id/StockMax"
android:textColor="#009900"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textSize="30sp" />
</LinearLayout>
</LinearLayout>

I would like the items to automatically resize (with all its child views) to fit the parentview (in height).
You need API 11 or above to scale a View. Usage like this :
LinearLayout ll = FindViewById<LinearLayout>(Resource.Id.Box);
float scalingFactor = 0.5f; // scale down to half the size
ll.ScaleX = scalingFactor;
ll.ScaleY = scalingFactor;
But the scale size is difficult to calculate.
Alternative choice, it is suggested that use CardView to implement this function.

xamarin card view layout

I'm trying to recreate a cardview similar to this one with an image with title on top and then some data and maybe some action buttons below. But for the life of me I can't get the text to be on top of the image.
Here is what I have so far
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:cardview="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="325dp"
android:layout_margin="8dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/image1"
android:layout_width="match_parent"
android:layout_height="230dp"
android:layout_alignParentTop="true"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/recipeName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image1"
android:maxLines="3"
android:padding="8dp"
android:text="name"
android:textColor="#222"
android:textStyle="bold"
android:textSize="22dp" />
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/recipeName"
android:maxLines="3"
android:padding="8dp"
android:text="description"
android:textColor="#666"
android:textSize="14dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="#+id/description">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/recipeName"
android:maxLines="3"
android:padding="8dp"
android:text="View"
android:textColor="#666"
android:textSize="14dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/recipeName"
android:maxLines="3"
android:padding="8dp"
android:text="Add"
android:textColor="#666"
android:textSize="14dp" />
</LinearLayout>
</RelativeLayout>

I will assume you want #+id/recipeName on top of #+id/image1.
On recipeName, you have set: android:layout_below="#+id/image1" which will layout the element below image1. Remove that line as you do not want it below that element. Try android:layout_alignBottom="#+id/image1". There are enough layout parameters to do most things: LayoutParams, though it can be a bit of a rabbit hole once you start doing complex layouts...
Also you've got layout_below on elements inside your LinearLayout which won't do anything.

TextInputLayout Xamarin(C#)

I writing app for Xamarin Android.
I try to use TextInputLayout
Here is my axml code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/main_bck">
<android.support.design.widget.TextInputLayout
android:id="#+id/usernameWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="300dp">
<EditText
android:id="#+id/username"
android:layout_width="match_parent"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:hint="Username" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/passwordWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/usernameWrapper"
android:layout_marginTop="5dp">
<EditText
android:id="#+id/username"
android:inputType="textPassword"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="password" />
</android.support.design.widget.TextInputLayout>
</RelativeLayout>
I need to set Edit Text on center of screen.
How I can do this?
Thanks

Use this in the TextView
android:layout_gravity="center_vertical"
or horizontal
android:layout_gravity="center_horizontal"