darkzangel
darkzangel

Reputation: 949

Custom Layout control

I'm trying to make a custom layout control similar to LinearLayout, but I want that all the controls inside wrap. It's like LinearLayout, but with wrapping. So, I took an example from android which is FixedGridControl and started modify it. It's working, but I got a problem.

The problem is when I put buttons inside, the text doesn't fallow the gravity that I gave them or whatever parameter I give. In the image below, the text inside the button should centered and in the vertical middle, but it's not.

enter image description here

The source of my FixedGridLayout class is:

package com.projects;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;

public class FixedGridLayout extends ViewGroup {

    int mCellWidth = 160;
    int mCellHeight = 120;

    public FixedGridLayout(Context context) {
        super(context);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int cellWidthSpec = MeasureSpec.makeMeasureSpec(mCellWidth, MeasureSpec.AT_MOST);
        int cellHeightSpec = MeasureSpec.makeMeasureSpec(mCellHeight, MeasureSpec.AT_MOST);

        int count = getChildCount();
        for (int index = 0; index < count; index++) {
            final View child = getChildAt(index);
            child.measure(cellWidthSpec, cellHeightSpec);
        }
        int minCount =  count > 3 ? count : 3;
        setMeasuredDimension(resolveSize(mCellWidth * minCount, widthMeasureSpec),
                resolveSize(mCellHeight * minCount, heightMeasureSpec));
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        int cellWidth = mCellWidth;
        int cellHeight = mCellHeight;
        int columns = (right - left) / cellWidth;
        if (columns < 0) {
            columns = 1;
        }
        int x = 0;
        int y = 0;
        int i = 0;
        int count = getChildCount();
        for (int index = 0; index < count; index++) {
            final View child = getChildAt(index);
            child.layout(x, y , x + cellWidth, y + cellHeight);
            if (i >= (columns - 1)) {
                i = 0;
                x = 0;
                y += cellHeight;
            } else {
                i++;
                x += cellWidth;
            }
        }
    }
}

The layout xml code I use to test is :

<?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">
    <com.projects.FixedGridLayout android:layout_width="600dp" android:layout_height="300dp">
       <Button android:text="Line1 Line2" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1 Line2 Line3" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1 Line2" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1 Line2 Line3" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1" android:gravity="center_horizontal|center_vertical" />
       <Button android:text="Line1" android:gravity="center_horizontal|center_vertical" />
    </com.projects.FixedGridLayout>
</LinearLayout>

The code of the class FixedGridLayout is a stripped, slightly modified and simplified for the purpose of my application and this question : http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/animation/FixedGridLayout.html

Upvotes: 0

Views: 1161

Answers (1)

Ken
Ken

Reputation: 1558

If you want to do something like that you should consider using a Grid View. http://developer.android.com/resources/tutorials/views/hello-gridview.html

Also, you can just do android:gravity="center" and you will get both center_horizontal and center_vertical

Upvotes: 1

Related Questions