Форум программистов, компьютерный форум CyberForum.ru

Программирование Android

Войти
Регистрация
Восстановить пароль
 
Рейтинг: Рейтинг темы: голосов - 18, средняя оценка - 4.67
75kolyan
0 / 0 / 0
Регистрация: 01.07.2014
Сообщений: 8
#1

Как создать квадратный TableLayout содержащий 100 ImageView? - Android

01.07.2014, 22:19. Просмотров 2265. Ответов 9
Метки нет (Все метки)

Здравствуйте уважаемые Специалисты!

Уже 2 недели ищу в интернете информацию и ничего нет.

У меня такой вопрос: есть 100 ImageView с квадратными картинками, картинки берутся из папок drawable соответственно dpi устройства и масштабируются во всех ImageView так как у каждого ImageView и у каждого tableRow установлено (android:layout_weight="1").

Вот фрагмент xml кода:
XML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<?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:background="#0099cc"
    android:orientation="vertical"
    android:weightSum="100" >
 
    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|center_horizontal"
        android:layout_weight="10"
        android:gravity="center_vertical|center_horizontal"
        android:text="TextView" />
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="80"
        android:orientation="horizontal"
        android:weightSum="100" >
 
        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical|center_horizontal"
            android:layout_weight="15"
            android:gravity="center_vertical|center_horizontal"
            android:text="TextView" />
 
        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="center_vertical|center_horizontal"
            android:layout_weight="70" >
 
            <TableLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical|center_horizontal"
                android:gravity="center_vertical|center_horizontal" >
 
                <TableRow
                    android:id="@+id/tableRow1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1" >
 
                        <ImageView
                            android:id="@+id/imageView01"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_margin="1dp"
                            android:layout_weight="1"
                            android:src="@drawable/a" />
 
                        <ImageView
                            android:id="@+id/imageView02"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_margin="1dp"
                            android:layout_weight="1"
                            android:src="@drawable/a" />
 
                        <ImageView
                            android:id="@+id/imageView03"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_margin="1dp"
                            android:layout_weight="1"
                            android:src="@drawable/a" />
и так далее.

Вот как это выглядит на эмуляторе с экраном 480х800:

Как создать квадратный TableLayout содержащий 100 ImageView?

а вот так на эмуляторе с экраном 2560х1600:

Как создать квадратный TableLayout содержащий 100 ImageView?


как сделать так, чтобы TableLayout был бы квадратным (вторая картинка) на всех разрешениях всех устройств. Ну или квадратный FrameLayout а уже в него вложен TableLayout занимающий всю площадь квадратного FrameLayout.

Заранее благодарен за помощь!!!

Прошу так-же привести пример кода!

С уважением!
После регистрации реклама в сообщениях будет скрыта и будут доступны все возможности форума.
ILNAR_93
Android
217 / 217 / 21
Регистрация: 19.01.2013
Сообщений: 1,587
Записей в блоге: 2
02.07.2014, 10:48     Как создать квадратный TableLayout содержащий 100 ImageView? #2
Возможно нужно программно задавать

android:layout_width="wrap_content" // фиксированный размер
android:layout_height="match_parent" // фиксированный размер

у FrameLayout..
GukZiLLA
35 / 35 / 2
Регистрация: 30.11.2013
Сообщений: 102
02.07.2014, 14:06     Как создать квадратный TableLayout содержащий 100 ImageView? #3
Делал как-то давно сапера, так вот там я использовал GridView и величину ячейки задавал - длина грида / количество ячеек

То есть брал величину ширины экрана в портретном режиме
Вычитал отступы по сторонам в dp
Задавал гриду размеры match_parent по ширине
После gridView.post(new Runnable(...)) - получал ширину грида и делил на количество элементов по горизонтали - так получая ширину одной ячейки
Так как ячейки квадратные, то высчитывал общую высоту всей доски и применял ко гриду

Все сводилось к методу, в который я передавал количество горизонтально, количество вертикально и все)
При этом после этого присваивалось gridView.setNumColumns(количество горизонтально);

Возможно есть и легче пути)
75kolyan
0 / 0 / 0
Регистрация: 01.07.2014
Сообщений: 8
02.07.2014, 17:41  [ТС]     Как создать квадратный TableLayout содержащий 100 ImageView? #4
Здравствуйте уважаемый GukZiLLA! А могли-бы Вы выложить немного кода для примера как это сделать, а то я не всё понял?
GukZiLLA
35 / 35 / 2
Регистрация: 30.11.2013
Сообщений: 102
02.07.2014, 19:57     Как создать квадратный TableLayout содержащий 100 ImageView? #5
Цитата Сообщение от 75kolyan Посмотреть сообщение
Здравствуйте уважаемый GukZiLLA! А могли-бы Вы выложить немного кода для примера как это сделать, а то я не всё понял?
Могу. Вот накидал рабочий код, конечно он небрежный и можно улучшать, но, думаю Вы все поймете и сделаете по-своему.

Вот GridView

XML
1
2
3
4
5
6
7
8
<GridView
        android:id="@+id/grid"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_margin="20dp" >
        
    </GridView>
А это метод, который заполняет его нужным количеством и пример адаптера

Java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
void createField(final Activity ac, final int columns, int lines) {
        final GridView grid = (GridView) ac.findViewById(R.id.grid);
        grid.setNumColumns(columns);
        
        final List<Integer> nums = new ArrayList<Integer>(columns * lines);
        for(int i = 0; i < columns * lines; i++) {
            nums.add(i);
        }
        
        grid.post(new Runnable() {
            @Override
            public void run() {
                grid.setAdapter(new AdGrid(ac, nums, columns, grid.getMeasuredWidth()));
            }
        });
        
    }
    
    
    class AdGrid extends BaseAdapter {
 
        int oneWidth;
        
        Activity ac;
        List<Integer> nums;
        int columns;
        int widthGrid;
        AdGrid(Activity ac, List<Integer> nums, int columns, int widthGrid) {
            this.ac = ac;
            this.nums = nums;
            this.columns = columns;
            
            this.widthGrid = widthGrid;
            oneWidth = widthGrid / columns;
        }
        
        @Override
        public int getCount() {
            return nums.size();
        }
 
        @Override
        public Object getItem(int location) {
            return nums.get(location);
        }
 
        @Override
        public long getItemId(int arg0) {
            return 0;
        }
 
        @Override
        public View getView(int location, View v, ViewGroup parent) {
            
            int number = nums.get(location);
            
            TextView tv = new TextView(ac);
            
            GridView.LayoutParams par = new GridView.LayoutParams(oneWidth, oneWidth);
            tv.setLayoutParams(par);
            
            tv.setBackgroundColor(Color.LTGRAY);
            tv.setText(number+"");
            tv.setGravity(Gravity.CENTER);
            tv.setTextSize(TypedValue.COMPLEX_UNIT_SP, oneWidth / 2);
            
            return tv;
        }
        
    }

Использовать это, например, так:

Java
1
createField(this, 10, 7);
Где this - это Ваша расширенная активити

И выглядит это все так

Как создать квадратный TableLayout содержащий 100 ImageView?
GukZiLLA
35 / 35 / 2
Регистрация: 30.11.2013
Сообщений: 102
02.07.2014, 22:30     Как создать квадратный TableLayout содержащий 100 ImageView? #6
Новый код, пробуйте и тогда при любых размерах поля N x Y и при любой ориентации экрана всегда все будет масштабироваться и влазить

Java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
    void createField(final Activity ac, final int columns, final int lines) {
        final GridView grid = (GridView) ac.findViewById(R.id.grid);
        grid.setNumColumns(columns);
        
        final List<Integer> nums = new ArrayList<Integer>(columns * lines);
        for(int i = 0; i < columns * lines; i++) {
            nums.add(i);
        }
        
        ViewGroup.LayoutParams params = grid.getLayoutParams();
        params.width = ViewGroup.LayoutParams.MATCH_PARENT;
        params.height = ViewGroup.LayoutParams.MATCH_PARENT;
        
        grid.post(new Runnable() {
            @Override
            public void run() {
                int width = grid.getMeasuredWidth();
                int height = grid.getMeasuredHeight();
                
                int oneWidth = width / columns;
                int oneHeight = height / lines;
                
                int oneSize = oneWidth > oneHeight ? oneHeight : oneWidth;
                
                ViewGroup.LayoutParams par = grid.getLayoutParams();
                par.width = oneSize * columns;
                par.height = oneSize * lines;
                
                grid.setAdapter(new AdGrid(ac, nums, oneSize));
            }
        });
        
    }
    
    
    
    
    static class AdGrid extends BaseAdapter {
 
        Activity ac;
        List<Integer> nums;
        int oneWidth;
        AdGrid(Activity ac, List<Integer> nums, int oneWidth) {
            this.ac = ac;
            this.nums = nums;
            this.oneWidth = oneWidth;
        }
        
        
        @Override
        public int getCount() {
            return nums.size();
        }
 
        @Override
        public Object getItem(int location) {
            return nums.get(location);
        }
 
        @Override
        public long getItemId(int arg0) {
            return 0;
        }
 
        @Override
        public View getView(int location, View v, ViewGroup parent) {
            
            int number = nums.get(location);
            
            TextView tv = new TextView(ac);
            
            GridView.LayoutParams par = new GridView.LayoutParams(oneWidth, oneWidth);
            tv.setLayoutParams(par);
            
            tv.setBackgroundColor(Color.LTGRAY);
            tv.setText(number+"");
            tv.setGravity(Gravity.CENTER);
            tv.setTextSize(TypedValue.COMPLEX_UNIT_SP, oneWidth / 2);
            
            return tv;
        }
        
    }
Примеры

Как создать квадратный TableLayout содержащий 100 ImageView?Как создать квадратный TableLayout содержащий 100 ImageView?
75kolyan
0 / 0 / 0
Регистрация: 01.07.2014
Сообщений: 8
03.07.2014, 00:17  [ТС]     Как создать квадратный TableLayout содержащий 100 ImageView? #7
Огромное Вам СПАСИБО GukZiLLA!!!

Я постараюсь разобраться в этом коде, с таким ещё не работал. Я раньше писал на Pascal а теперь изучаю Java. Я уже написал одну игру тест вопрос и 4 варианта ответов для Андроида,сейчас тестирую и дорабатываю её. А теперь хочу переделать другую мою игру с Паскаля на Джаву для Андроида и столкнулся с проблемой. У Вас в примере в ячейках GridView вместо картинок просто серый фон и текст а мне надо туда вставить 121 ImageView (11 строк на 11 столбцов) и ещё отслеживать нажатия на этих ImageView и менять в них картинки во время работы приложения.

Мне-бы просто как-нибудь сделать квадратный FrameLayout а в него вставить TableLayout с ImageView и всё, дальше у меня уже весь игровой код в голове. В общем проблема во внешнем оформлении. Почему у FrameLayouta нет свойства уровнять ширину и высоту?

Моя игра располагается только в положении android:screenOrientation="landscape" и должна в нём оставаться. Высоту я выставил с помощью LinearLayout Weihgt Sum=100 и на высоту во FrameLayout (который вложен в LinearLayout) я выделил 70 от 100 и теперь мне надо просто сделать так, чтобы ширина FrameLayout стала равной его высоте. А уже TableLayot со всеми 121 ImageView я вложу во FrameLayout и он займёт всю ширину и высоту своего родителя, то-есть квадратного FrameLayout и таким образом все 121 картинки будут всегда располагаться в квадратном поле и по центру экрана.

Вот что мне надо:

Как создать квадратный TableLayout содержащий 100 ImageView?

Есть ли такой способ или в Джаве вообще нет возможности создать квадратный Layout?

С уважением!!!
GukZiLLA
35 / 35 / 2
Регистрация: 30.11.2013
Сообщений: 102
03.07.2014, 09:31     Как создать квадратный TableLayout содержащий 100 ImageView? #8
Цитата Сообщение от 75kolyan Посмотреть сообщение
У Вас в примере в ячейках GridView вместо картинок просто серый фон и текст а мне надо туда вставить 121 ImageView (11 строк на 11 столбцов) и ещё отслеживать нажатия на этих ImageView и менять в них картинки во время работы приложения.
Оу, хотите совет? Если пишите игру, то всегда пишите ее на движках. У меня друг пишет на паскале, используя замечательный движок ZenGL. На сколько я знаю, он экспортирует игры и под декстоп, и под андроид и под айос. А код всегда один!

Для джавы есть другой хорожий движок - libGDX
На нем я сам написал две маленькие игры.

Цитата Сообщение от 75kolyan Посмотреть сообщение
Есть ли такой способ или в Джаве вообще нет возможности создать квадратный Layout?
Вот прям в верстке? Нет, но я же написал пример. Вы можете в метод createFIeld передать например 10 на 10 и будет квадрат.
75kolyan
0 / 0 / 0
Регистрация: 01.07.2014
Сообщений: 8
04.07.2014, 09:16  [ТС]     Как создать квадратный TableLayout содержащий 100 ImageView? #9
И снова большое СПАСИБО GukZiLLA!!!

Почитал про движки, потом попробую. На выходных буду разбираться с GridView и адаптером для создания сетки 10 х 10, как Вы и писали: "Вы можете в метод createFIeld передать например 10 на 10 и будет квадрат".

Правда чувство неудовлетворения от невозможности создания квадратного FrameLayout всё таки осталось. Ведь наверняка есть много моментов, когда это может понадобиться. Я вот тут нашел статью про то как сделать квадратную кнопку переопределив метод OnMeasure, правда там не понятно куда надо вставлять этот код и как его использовать в текущей активности. Не хватает полного кода.

Может быть есть такая возможность через этот метод OnMeasure сделать квадратный FrameLayout или вообще любой Layout? Если это возможно, то можно пожалуйста код выложить и где его вставить и как использовать!

С уважением!
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
10.07.2014, 08:36     Как создать квадратный TableLayout содержащий 100 ImageView?
Еще ссылки по теме:

Как в ячейке TableLayout совместить два изображения? Android
Как подогнать ряд кнопок в TableLayout под ширину экрана? Android
Android Как изменить размер ImageView из кода?
Android Как нарисовать imageView сверху остальных view?
TableLayout как отловить значение строки по нажатию (для Андроид на java) Android

Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
75kolyan
0 / 0 / 0
Регистрация: 01.07.2014
Сообщений: 8
10.07.2014, 08:36  [ТС]     Как создать квадратный TableLayout содержащий 100 ImageView? #10
На выходных разбирался с движками и должен сказать, что оба движка ОЧЕНЬ достойны внимания! Правда для libGDX есть уроки а вот с ZenGL надо разбираться самому, да и не понятно как импортировать игру в арк файл, поэтому остановился на libGDX. Правда поставить движок пока не получилось, буду дальше пробовать настраивать.
Yandex
Объявления
10.07.2014, 08:36     Как создать квадратный TableLayout содержащий 100 ImageView?
Ответ Создать тему
Опции темы

Текущее время: 16:47. Часовой пояс GMT +3.
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Рейтинг@Mail.ru