Xamarin.Android – Automatic Grid Height
We all use usually grids in our apps. But it doesn’t matter how it appears. Here now it’s not going to be about having a grid and exposing it to a page and just going to be there, but there’s more of everything on a page and you don’t want to have a certain height and be able to scroll through a small area but be as high as there are elements in it.
First step: create a Xamarin.Android Project.
Instead of the ListView, we have to impleemnt a custom GridView: ExpandableHeightGridView. I created a Components folder in my project and in this filder I created this implementation:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Util;
using Android.Views;
using Android.Widget;
namespace Droid.Components
{
public class ExpandableHeightGridView : GridView
{
bool expanded = false;
public ExpandableHeightGridView(Context context) : base(context)
{
}
protected ExpandableHeightGridView(IntPtr javaReference, JniHandleOwnership transfer) : base(javaReference, transfer)
{
}
public ExpandableHeightGridView(Context context, IAttributeSet attrs) : base(context, attrs)
{
}
public ExpandableHeightGridView(Context context, IAttributeSet attrs, int defStyleAttr) : base(context, attrs, defStyleAttr)
{
}
public ExpandableHeightGridView(Context context, IAttributeSet attrs, int defStyleAttr, int defStyleRes) : base(context, attrs, defStyleAttr, defStyleRes)
{
}
public bool IsExpanded()
{
return expanded;
}
protected override void OnMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
if (IsExpanded())
{
int expandSpec = MeasureSpec.MakeMeasureSpec(MeasuredSizeMask,
MeasureSpecMode.AtMost);
base.OnMeasure(widthMeasureSpec, expandSpec);
ViewGroup.LayoutParams paramss = LayoutParameters;
paramss.Height = MeasuredHeight;
}
else
{
base.OnMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
public void SetExpanded(bool expanded)
{
this.expanded = expanded;
}
}
}
After this we can use this view in our layouts:
<Droid.Components.ExpandableHeightGridView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:numColumns="2"
android:layout_marginBottom="20dp"
android:listSelector="@android:color/transparent"
android:background="@android:color/transparent"
android:id="@+id/someGridView"/>
We have to code in the code behind. Open your Activity.cs and Find this view and set it’s Height auto:
ExpandableHeightGridView someGridView= (ExpandableHeightGridView)view.FindViewById(Resource.Id.someGridView);
someGridView.Adapter = newSomeAdapter(someList);
someGridView.SetExpanded(true);
That’s all, you GridView will automatically scale.