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

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

Войти
Регистрация
Восстановить пароль
 
PhantomR
5 / 5 / 0
Регистрация: 04.02.2016
Сообщений: 74
#1

Viewpager with indicator + horizontal scrolling - Программирование Android

19.08.2016, 07:58. Просмотров 375. Ответов 13
Метки нет (Все метки)

Есть приложение: https://github.com/PhantomRec/JSON

В нём реализован список в виде RecyclerView с данным взятыми из JSON формата.

Необходимо сделать горизонтально прокручивающийся список в 2 ряда и 3 столбика (6 элементов) с индикацией отображения количества страниц и на какой странице находимся. Я так понимаю необходим viewpager with indicator ? Как же сделать 3х2? С помощью framelayout или как ещё, подскажите?
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
19.08.2016, 07:58
Здравствуйте! Я подобрал для вас темы с ответами на вопрос Viewpager with indicator + horizontal scrolling (Программирование Android):

ViewPager Indicator - Программирование Android
Здравствуйте! Взял пример с https://github.com/JakeWharton/Android-ViewPagerIndicator и хотел бы объединить табы с индикатором который...

Как в TabWidget убрать Tab indicator? - Программирование Android
Можно ли его выключить, или хотя бы сделать прозрачного цвета?

Изображения в Scrolling Activity - Программирование Android
Предполагается активити, на которой по очереди будут идти текст и изображения (изображения с подписями). В интернете нашла как сделать...

Отмена scrolling-a одной страницы - Программирование Android
Всем добрый день. Уважаемые форумчание и гуру андроида, помогите разобраться самостоятельно решить не смог. ***************** Есть...

Как можно сделать scrolling не текста, а картинок? - Программирование Android
Подскажите пожалуйста как можно сделать scrolling не текста, а картинок

ViewPager - Программирование Android
Всем. Да я недалекий и тупой, уже дня три не могу никак понять :wall: Есть ViewPager <android.support.v4.view.ViewPager ...

Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
CoolMind
418 / 401 / 65
Регистрация: 06.10.2012
Сообщений: 1,727
19.08.2016, 12:06 #2
PhantomR, хоть бы картинку нарисовали, что ли.
Для таблиц есть два варианта: TableLayout, LinearLayout.
PhantomR
5 / 5 / 0
Регистрация: 04.02.2016
Сообщений: 74
19.08.2016, 12:35  [ТС] #3
Вот картинка приложения.
Миниатюры
Viewpager with indicator + horizontal scrolling  
CoolMind
418 / 401 / 65
Регистрация: 06.10.2012
Сообщений: 1,727
19.08.2016, 15:51 #4
PhantomR, ха-ха
Просто я недавно как раз мучался с ViewPager, мучения ещё не закончены, так что могу сказать пару "ласковых".
Прежде всего, сам ViewPager не в курсе, что у него происходит внутри. Поэтому он даже не в состоянии в разметке угадать, чему равна его собственная высота, поскольку он ориентируется на содержимое, а оно может меняться. Поэтому ViewPager в разметке займёт весь экран, и это поначалу сильно мешает.
XML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
Начало разметки.
            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
 
                <android.support.v4.view.ViewPager
                    android:id="@+id/viewpager"
                    android:layout_width="match_parent"
                    android:layout_height="300dp"/>
 
                <LinearLayout
                    android:id="@+id/number_layout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="#ffffff"
                    android:gravity="center"
                    android:orientation="horizontal"/>
 
            </FrameLayout>
 
Здесь остальная часть разметки.
Примерно так выглядит разметка для ViewPager, у которого вверху есть прямоугольник с номерами страниц, точками и чем угодно.
Сам ViewPager и индикатор страниц заполняются программно. На этот счёт есть множество руководств. Вам можно, например, использовать стандарт - создание фрагментов. У меня это были изображения, поэтому я фрагменты не использовал.
Также надо создать класс-адаптер, в котором прописать логику создания страниц (или фрагментов). Назначить слушатель для ViewPager, в котором описать события пролистывания. Установить текущую страницу (setCurrentItem(0)). Обозначить первый номер страницы (это будет, скорее всего, какой-то специальный рисунок).
При повороте устройства не забыть запомнить номер страницы и потом её восстановить. Там много всего под все случаи жизни.
Mikalai
256 / 232 / 93
Регистрация: 11.01.2015
Сообщений: 655
20.08.2016, 13:02 #5
PhantomR, для индикаторов - viewpager indicator

Не по теме:

Вчера решил попробовать выложить в общий доступ какую-нибудь библиотеку. Под руку попался самописный индикатор. Вот только закончил оформлять. Но из jcenter пока не видно её. Запрос отправил. Молчат партизаны.

PhantomR
5 / 5 / 0
Регистрация: 04.02.2016
Сообщений: 74
20.08.2016, 13:04  [ТС] #6
Спасибо.

А элементы списка 2х3 с помощью Fragment делать как-то?
Mikalai
256 / 232 / 93
Регистрация: 11.01.2015
Сообщений: 655
20.08.2016, 18:05 #7
PhantomR, можно по разному делать. Как вариант на вскидку:
Делаем свой квадратный view-элемент. Например переопределим RelativeLayout и в него потом напихаем что хотим.

Java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
public class MyOwnRelativeLayout extends RelativeLayout {
    public MyOwnRelativeLayout(Context context) {
        super(context);
    }
 
    public MyOwnRelativeLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
 
    public MyOwnRelativeLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
 
    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    public MyOwnRelativeLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }
 
    @Override
    public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, widthMeasureSpec);
    }
}
Для примера положим в него ImageView. Получится следующая разметка для Fragment'а:

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
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<?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">
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
 
        <package.MyOwnRelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="click">
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/pic1" />
        </package.MyOwnRelativeLayout>
 
        <package.MyOwnRelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="click">
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/pic1" />
        </package.MyOwnRelativeLayout>
 
        <package.MyOwnRelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="click">
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/pic1" />
        </package.MyOwnRelativeLayout>
 
    </LinearLayout>
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
 
        <package.MyOwnRelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="click">
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/pic1" />
        </package.MyOwnRelativeLayout>
 
        <package.MyOwnRelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="click">
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/pic1" />
        </package.MyOwnRelativeLayout>
 
        <package.MyOwnRelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="click">
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/pic1" />
        </package.MyOwnRelativeLayout>
 
    </LinearLayout>
</LinearLayout>
Ну а потом такие фрагменты вставлять во ViewPager нужно будет. Хотя для отображения списка это коряво всё получается. Геморойно будет данные вставлять в эти вью. Нужно смотреть в сторону RecyclerView однозначно.
CoolMind
418 / 401 / 65
Регистрация: 06.10.2012
Сообщений: 1,727
22.08.2016, 10:19 #8
Цитата Сообщение от PhantomR Посмотреть сообщение
А элементы списка 2х3 с помощью Fragment делать как-то?
Фрагмент сам по себе служит для хранения внутри себя какого-то содержимого. Т.е. достаточно создать с помощью "мастера" фрагмент, а уже в разметке прописать, например, TableLayout. Если содержимое меняется динамически, то можно заморочиться чем-то вроде GridView с адаптером. RecyclerView тут ни при чём.
Pablito
22.08.2016, 10:43
  #9

Не по теме:

по сути, задача на 1-2 дня максимум, но при условии что есть четкое понимание что и как должно выглядеть, я говорю именно про внешний вид
делать какое-то общее решение - занятие неблагодарное

PhantomR
5 / 5 / 0
Регистрация: 04.02.2016
Сообщений: 74
22.08.2016, 11:25  [ТС] #10
Касательно внешнего вида, есть чёткий рисунок и понимание. А вот какие технологии использовать. Для этого эту тему и создал.

Склоняюсь к gridview с адаптером для отображения 2х3
CoolMind
418 / 401 / 65
Регистрация: 06.10.2012
Сообщений: 1,727
22.08.2016, 14:38 #11
Цитата Сообщение от PhantomR Посмотреть сообщение
есть чёткий рисунок и понимание
Оба раза ха-ха.
Цитата Сообщение от PhantomR Посмотреть сообщение
Склоняюсь к gridview с адаптером для отображения 2х3
Начните уже делать.
Mikalai
256 / 232 / 93
Регистрация: 11.01.2015
Сообщений: 655
25.08.2016, 02:01 #12
Цитата Сообщение от CoolMind Посмотреть сообщение
RecyclerView тут ни при чём.
А как же тогда это получается? Или это не RecyclerView? ))
зы: гиф поплыл ))
Миниатюры
Viewpager with indicator + horizontal scrolling  
CoolMind
418 / 401 / 65
Регистрация: 06.10.2012
Сообщений: 1,727
25.08.2016, 11:41 #13
Mikalai, наверное, можно и RecyclerView с соответствующими настройками, но проще всего подходит GridView, он как раз для этого и предназначен. Если сделали с первым, то молодец.
PhantomR
5 / 5 / 0
Регистрация: 04.02.2016
Сообщений: 74
25.08.2016, 13:13  [ТС] #14
Тут прикол, что нужно считывать каждую страницу с 6 элементами и снизу показывать точками сколько этих страниц. И показывать на какой находимся (1-ая страница с 1 по 6 элемент, 2-ая страница с 7 по 12 элемент и так далее).
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
25.08.2016, 13:13
Привет! Вот еще темы с ответами:

ViewPager - Программирование Android
Здравствуйте! В приложении использовал пример с Хабра http://habrahabr.ru/post/131889/, однако, не могу понять как при прокрутке экранов...

ViewPager - Программирование Android
Помогите пожалуйста. Использую эту фичу в своей программе(пример один и его очень много в поисковике). И столкнулся с проблемой. На...

Правильный ViewPager - Программирование Android
Вообщем все что я сделал прикрепил на картинке. Беда то вот в чем. Ну например я тыкаю пальцем ну и скролирую, а тыкаю то я в кнопку...

ViewPager автодаводка - Программирование Android
Подскажите пожалст ,как можно изменить автодаводку уменьшить или увеличить?


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

Или воспользуйтесь поиском по форуму:
Yandex
Объявления
25.08.2016, 13:13
Ответ Создать тему
Опции темы

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