Равномерное заполнение колонками пространства с помощью GridLayout

@BeutiFul BiTcH · Регистрация: 21.01.2016

Author24 — интернет-сервис помощи студентам

Всем добрый вечер!
Помогите пожалуйста!
Мне нужно программно заполнять GridLayout. Проблема чтобы колонки равномерно заполнили все пространство.

Хочу:

Равномерное заполнение колонками пространства с помощью GridLayout

Имею:

Pablito · 22.02.2016, 19:46

колонок сколько должно быть?

Добавлено через 12 минут
Динамическая кнопка с картинкой
там код, который я делал для одного неблагодарного человека
код переделывается для любого количества колонок и под любой лаяут

@BeutiFul BiTcH · 23.02.2016, 00:07 **[ТС]**

Спасибо, Паблито!
3 колонки. Попытаюсь разобраться в Вашем примере.

Добавлено через 3 часа 53 минуты
Паблито, помогите разобраться с примером.

Вставила виджет в разметку:

XML

    <ScrollView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        android:layout_gravity="center"
        android:paddingTop="@dimen/sunHeight">
 
        <android.support.v7.widget.GridLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/menuLayout">
        </android.support.v7.widget.GridLayout>
    </ScrollView>

Пытаюсь в коде наполнить виджет картинками:

Java

...
import android.support.v7.widget.GridLayout;
...
private GridLayout menuLayout;
private final int menuLayoutColumnCount = 3;
...
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        ...
       
        menuLayout = (GridLayout) findViewById(R.id.menuLayout);
        menuLayout.setColumnCount(menuLayoutColumnCount);
 
        ImageView im1 = new ImageView(this);
        ImageView im2 = new ImageView(this);
        ImageView im3 = new ImageView(this);
 
        im1.setImageResource(R.drawable.img);
        im2.setImageResource(R.drawable.img);
        im3.setImageResource(R.drawable.img);
 
        GridLayout.LayoutParams lp1 = new GridLayout.LayoutParams();
        lp1.width = 0;
        lp1.height = 0;
        lp1.columnSpec = GridLayout.spec(1, 1f);
        lp1.rowSpec = GridLayout.spec(1, 1f);
 
        GridLayout.LayoutParams lp2 = new GridLayout.LayoutParams();
        lp2.width = 0;
        lp2.height = 0;
        lp2.columnSpec = GridLayout.spec(2, 1f);
        lp2.rowSpec = GridLayout.spec(1, 1f);
 
        GridLayout.LayoutParams lp3 = new GridLayout.LayoutParams();
        lp3.width = 0;
        lp3.height = 0;
        lp3.columnSpec = GridLayout.spec(3, 1f);
        lp3.rowSpec = GridLayout.spec(1, 1f);
 
        menuLayout.addView(im1, lp1);
        menuLayout.addView(im2, lp2);
        menuLayout.addView(im3, lp3);
        ...
    }

У Вас написано, что необходимо установить width и height в 0 потому что ниже мы указываем вес 1 и они будут сами высчитывать размеры.
В моем варианте получаю пустую активность. Убрав строки с размерами леяута - одна картинку на весь дисплей.
В чем моя ошибка?

Pablito · 23.02.2016, 11:48

я для себя начал делать по этой задаче, как сделаю - отпишусь

вопрос - в процессе работы программы будут добавляться какие-то вьюшки, которые будут идти в GridLayout в три колонки, количество строк заранее неизвестно
я все правильно понял?

Pablito · 23.02.2016, 13:00

итак
1. как обычно, подключаем новый лаяут

XML

1	compile 'com.android.support:gridlayout-v7:23.1.1'

2. в разметку активити добавляем куда нам надо сам лаяут, я назвал его так же field, это не принципиально
указываем в нем количество колонок, в примере их 3

XML

    <android.support.v7.widget.GridLayout
        android:id="@+id/field"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        app:columnCount="3">

3. в onCreate нашей активити находим этот лаяут

Java

1	GridLayout field = (GridLayout) findViewById(R.id.field);

4. создаем где-то в активити для удобства метод, который будет добавлять любое View в этот GridLayout
(хоть кнопку, хоть целую разметку, что туда передадим то и добавит)

Java

    private void addViewToGrid(GridLayout field, View view) {
        GridLayout.LayoutParams lp = new GridLayout.LayoutParams();
        lp.width = 0;
        lp.height = 0;
        lp.columnSpec = GridLayout.spec(GridLayout.UNDEFINED, 1f);
        lp.rowSpec = GridLayout.spec(GridLayout.UNDEFINED, 1f);
        field.addView(view, lp);
    }

4. для примера я сделал xml разметку для "айтема", которыми будет наполняться этот GridLayout
назовем файл например grid_item.xml и положим его в папку layout

XML

<?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">
 
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:layout_marginTop="4dp"
        android:layout_weight="1"
        android:src="#d99" />
 
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#d79"
        android:layout_margin="4dp"
        android:gravity="center_horizontal"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1"
        android:text="This is TextView" />
 
</LinearLayout>

5. теперь можно добавлять, пример кода, создаем 10 вьюшек из нашего лаяута grid_item и добавляем их в GridLayout

Java

        for (int i = 0; i < 10; i++) {
            View v = View.inflate(this, R.layout.grid_item, null); //  this если это просиходит в активити, если фрагмент то getContext()
            addViewToGrid(field, v);
        }

6. PROFIT

Pablito · 23.02.2016, 14:29

небольшое исправление, в примере выше я забыл что высота будет тоже меняться, там тоже присутствует вес
и GridLayout был не в скроллвью

поэтому так addViewToGrid

Java

    private void addViewToGrid(GridLayout field, View view) {
        GridLayout.LayoutParams lp = new GridLayout.LayoutParams();
        lp.width = 0;
        lp.height = ViewGroup.LayoutParams.WRAP_CONTENT;
        lp.columnSpec = GridLayout.spec(GridLayout.UNDEFINED, 1f);
        field.addView(view, lp);
    }

и сам лаяут

XML

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
 
    <android.support.v7.widget.GridLayout
        android:id="@+id/field"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:columnCount="3"/>
 
</ScrollView>

остальное без изменений

@BeutiFul BiTcH · 23.02.2016, 23:35 **[ТС]**

Паблито, большое спасибо!!!
Универсальная штука

Добавлено через 22 минуты

Сообщение от Паблито

вопрос - в процессе работы программы будут добавляться какие-то вьюшки, которые будут идти в GridLayout в три колонки, количество строк заранее неизвестно
я все правильно понял?

Да, все именно так как я хотела

@pronych · 17.03.2016, 00:34

насколько я понимаю, GridLayout.spec() начинает работать с редакции от API:23 ?
так и не смог победить строку
lp.columnSpec = GridLayout.spec(GridLayout.UNDEFINED, 1f);
подчёркивает spec и указывает на версию 23, а у меня мол, поддержка min:api14

у меня задача разместить произвольный алфавит в кнопках на экране примерно так

0000000

00000

разумеется, при другой ориентации будет другое соотношение вертикальных/горизонтальных элементов
00000
00000
00000
00000
00000
00000
000

хочется сделать универсальный алгоритм, а учитывая приличное количество влияющих факторов, второй день чешу репу в все их учесть

предполагаю, чтобы разместить несколько рядов кнопок с различным количеством в рядах и выравниванием всей таблицы по линии центра, оптимально будет использовать набор горизонтальных LinearLayout в таком же вертикальном.
посоветуйте, правильно понимаю?

говорю сразу - в яву и андроид вникаю третий день ))

Pablito · 17.03.2016, 11:11

Сообщение от pronych

GridLayout.spec() начинает работать с редакции от API:23 ?

нет, он отдельно подключается (строка выше есть)

создай свою тему и задавай вопросы там, для третьего дня в андроид это жирно, лезть в такие дебри

@pronych · 17.03.2016, 11:42

Спасибо за ответ.

@pronych · 18.03.2016, 10:59

Убрал скролл из лаяута и вертикальное выравнивание изменил

XML

<android.support.v7.widget.GridLayout
    android:id="@+id/field"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android" />

Изменил тут

Java

    private void addViewToGrid(GridLayout field, View view) {
        GridLayout.LayoutParams lp = new GridLayout.LayoutParams();
        lp.width  = 0;
        lp.height = 0;//ViewGroup.LayoutParams.WRAP_CONTENT MATCH_PARENT
        lp.columnSpec = GridLayout.spec(GridLayout.UNDEFINED    , 1f);// позиция и вес кнопки по горизонтали
        lp.rowSpec    = GridLayout.spec(GridLayout.ALIGN_MARGINS, 1f);// позиция и вес кнопки по вертикали
        field.addView(view, lp);
    }

Заполняю так

Java

        layout.setColumnCount(cols);
        TListener tl = new TListener();//слушатель для кнопок
        for (int i=0;i<cnt;i++) {                       //
            Button b = new Button(layout.getContext()); //создаём батоны, получаем id ресурса буквы
            int char_id  = rss.getIdentifier("char" + String.valueOf(i), "string", getPackageName());
            if(char_id==0){continue;}        //пропускаем, если нет ресурса
            b.setText(getString(char_id))   ;//подписываем кнопку
            b.setOnTouchListener(tl)        ;//начинаем слушать кнопку
            addViewToGrid(layout, b)        ;//добавляем
        }

На пятый день обжига горшков результат устраивает:

@tezaurismosis · 18.03.2016, 17:56

Комментарий модератора

pronych, уважительно относитесь к пользователям. Предупреждение.

CoolMind, Паблито, прекратите выяснять отношения в темах.
Во-первых, пользователям неинтересно читать ваши препирательства.
Во-вторых, это запрещено правилами.
При повторе оба получите по карте.

@EVIL SnaKe · 22.03.2016, 16:08

Ребята, помогите. Всё сделал по инструкции, но у меня все кнопки накладываются 1 на 1 и расположены по середине Grid Layout. В чём может быть проблема ?

Pablito · 22.03.2016, 16:10

код, разметка, импорты и строка из градла где?

@EVIL SnaKe · 22.03.2016, 16:39

Grid:

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:grid="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="64dp"
    android:focusable="false"
    android:transitionGroup="false">
    
   <!-- List, empty view and swiperefreshlayout are past here, programmatically -->
 
    <android.support.v7.widget.GridLayout
        android:id="@+id/actionmode_over_menu_grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:minHeight="64dp"
        android:visibility="visible"
        android:background="@color/background_actionmode_pda"
        app:useDefaultMargins="false">
    </android.support.v7.widget.GridLayout>

Layout кнопок которые вставляю в Grid:

XML

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/multiselectButtonFrame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="@dimen/multiselect_menu_buttons_padding_vertical"
    android:paddingBottom="@dimen/multiselect_menu_buttons_padding_vertical">
    <!--app:layout_gravity="start">-->
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical|center_horizontal"
            android:orientation="vertical"
            android:gravity="center_horizontal">
            <ImageView
                android:id="@+id/multiselect_action_icon"
                android:layout_width="32dp"
                android:layout_height="32dp"
                android:layout_gravity="center_vertical|center_horizontal"
                android:contentDescription=""
                android:src="@drawable/ic_action_encrypt"/>
            <TextView
                android:id="@+id/multiselect_action_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:ellipsize="end"
                android:textSize="12sp"
                android:text="Button 1"/>
        </LinearLayout>
</FrameLayout>

Так добавляю кнопки:

Java

import android.support.v7.widget.GridLayout;
 
...
 
public void init(int configArrayResId) {
        clearMenu();
        String[] actionConfigs = getResources().getStringArray(configArrayResId);
        int buttonsCount = 0;
        secondaryMenuGrid.setColumnCount(calculateColumsNumber(buttonWidthDp));
        Log.i(Constants.TAG_UI, "MultiSelect menu columns number = " + secondaryMenuGrid.getColumnCount());
        MultiselectActionView mOverflowButton = null;
 
        GridLayout.Spec columnSpec = GridLayout.spec(GridLayout.UNDEFINED, 1f);
        GridLayout.Spec rowSpec = GridLayout.spec(GridLayout.UNDEFINED, 1f);
        GridLayout.LayoutParams lp = new GridLayout.LayoutParams(rowSpec, columnSpec);
 
        rowCount = calculateRowCount(actionConfigs.length);
        secondaryMenuGrid.setRowCount(rowCount);
        Log.i(Constants.TAG_UI, "MultiSelect menu rows number = " + secondaryMenuGrid.getRowCount());
        int position = 0;
        for(String config: actionConfigs) {
            String[] parts = config.split("\\|");
            Actions action = Actions.valueOf(parts[0]);
            MultiselectActionView msav = new MultiselectActionView(getContext(), action);
 
            if (!action.equals(Actions.EmptyAction)) {
                msav.setOnClickListener(this);
            }
            
            boolean visible = Integer.valueOf(parts[2]).intValue() > 0;
            msav.setVisibility(visible ? View.VISIBLE : View.GONE);
            if (action.equals(Actions.Overflow)) {
                mOverflowButton = msav;
            } else {
                msav.setLayoutParams(lp);
                secondaryMenuGrid.addView(msav, position);
                position++;
            }
        }
 
        if (rowCount>1) {
            mOverflowButton.setLayoutParams(lp);
            secondaryMenuGrid.addView(mOverflowButton, secondaryMenuGrid.getColumnCount()-1);
        }
    }

Вот что получаю в итоге:

Pablito · 22.03.2016, 16:45

ой не, я это читать не стану, не похожу вообще на тот код что я давал

@BeutiFul BiTcH 1 / 1 / 0 Регистрация: 21.01.2016 Сообщений: 20
		1
	Равномерное заполнение колонками пространства с помощью GridLayout 22.02.2016, 19:26. Показов 8672. Ответов 15 Метки нет (Все метки) Всем добрый вечер! Помогите пожалуйста! Мне нужно программно заполнять GridLayout. Проблема чтобы колонки равномерно заполнили все пространство. Хочу: Имею: 0

Pablito 2883 / 2295 / 769 Регистрация: 12.05.2014 Сообщений: 7,978
	22.02.2016, 19:46	2
	колонок сколько должно быть? Добавлено через 12 минут Динамическая кнопка с картинкой там код, который я делал для одного неблагодарного человека код переделывается для любого количества колонок и под любой лаяут 1

Pablito 2883 / 2295 / 769 Регистрация: 12.05.2014 Сообщений: 7,978
	23.02.2016, 11:48	4
	я для себя начал делать по этой задаче, как сделаю - отпишусь вопрос - в процессе работы программы будут добавляться какие-то вьюшки, которые будут идти в GridLayout в три колонки, количество строк заранее неизвестно я все правильно понял? 0

@BeutiFul BiTcH 1 / 1 / 0 Регистрация: 21.01.2016 Сообщений: 20
	23.02.2016, 23:35 [ТС]	7
	Паблито, большое спасибо!!! Универсальная штука Добавлено через 22 минуты Сообщение от Паблито вопрос - в процессе работы программы будут добавляться какие-то вьюшки, которые будут идти в GridLayout в три колонки, количество строк заранее неизвестно я все правильно понял? Да, все именно так как я хотела 0

Pablito 2883 / 2295 / 769 Регистрация: 12.05.2014 Сообщений: 7,978
	17.03.2016, 11:11	9
	Сообщение от pronych GridLayout.spec() начинает работать с редакции от API:23 ? нет, он отдельно подключается (строка выше есть) создай свою тему и задавай вопросы там, для третьего дня в андроид это жирно, лезть в такие дебри 1

@pronych 0 / 0 / 0 Регистрация: 16.03.2016 Сообщений: 3
	17.03.2016, 11:42	10
	Спасибо за ответ. 0

@EVIL SnaKe 0 / 0 / 0 Регистрация: 22.03.2016 Сообщений: 2
	22.03.2016, 16:08	13
	Ребята, помогите. Всё сделал по инструкции, но у меня все кнопки накладываются 1 на 1 и расположены по середине Grid Layout. В чём может быть проблема ? 0

Pablito 2883 / 2295 / 769 Регистрация: 12.05.2014 Сообщений: 7,978
	22.03.2016, 16:10	14
	код, разметка, импорты и строка из градла где? 0

Pablito 2883 / 2295 / 769 Регистрация: 12.05.2014 Сообщений: 7,978
	22.03.2016, 16:45	16
	ой не, я это читать не стану, не похожу вообще на тот код что я давал 0

Равномерное заполнение колонками пространства с помощью GridLayout

Решение