Подтвердить что ты не робот

Android - аккордеонный виджет

Я ищу лучший способ создания виджета стиля Аккордеона, такого как на этой странице. Есть ли способ добиться такого же эффекта с помощью стандартного инструментария Android или мне нужно создать собственный виджет? Если да, то какой из них вы бы рекомендовали продлить, если таковые имеются?

4b9b3361

Ответ 1

Я поставил проект андроидного аккордеона в github. Мы используем его для наших клиентов, проверенных на 2.2, 2.3.x, 3.2 и 4.0.3. Работает очень хорошо для нас.

Переход к добавлению анимации в складке/разворачивании в следующем шаге.

Вот небольшой скриншот:

enter image description here

Ответ 2

И в случае, если вы все еще задаетесь вопросом - это может быть сделано в значительной степени с помощью пары кнопок/макетов, уложенных внутри линейного макета. Псевдокод следует за

<LinearLayout android:orientation="vertical">
    <Button android:text="Panel 1"/>
    <SomeKindOfLayout android:id="@+id/panel1">
            <!-- widgets in first panel go here -->
    </SomeKindOfLayout>
    <Button android:text="Panel 2"/>
    <SomeKindOfLayout android:id="@+id/panel2" android:visibility="gone">
            <!-- widgets in second panel go here -->
    </SomeKindOfLayout>
    <Button android:text="Panel 3"/>
    <SomeKindOfLayout android:id="@+id/panel3" android:visibility="gone">
            <!-- widgets in third panel go here -->
    </SomeKindOfLayout>
    <Button android:text="Panel 4"/>
    <SomeKindOfLayout android:id="@+id/panel4" android:visibility="gone">
            <!-- widgets in fourth panel go here -->
    </SomeKindOfLayout></LinearLayout>

Еще одна вещь, которую вы можете попробовать: стекировать ExpandableListView друг на друга

Ответ 3

Я должен рискнуть сам и сказать, что ответ @Bostone является наиболее подходящим. Я дам вам свой код ниже, чтобы вы могли видеть. Спасибо за GitHub Maciej Łopaciński, но, как сказал @SudoPlz в комментариях, документации вообще нет. Я не знал, с чего начать. Я пытаюсь сделать это с помощью Eclipse и Android Studio, и ни я не мог запустить проект, чтобы начать выяснять, как его работа. Кроме того, последний бой в этом проекте был около 1 года назад, что заставляет меня бояться многого, что если что-то пойдет не так, я застрянет в тупике. Итак, без дальнейших задержек, вот мое решение, основанное на @Bostone:

1.- Сначала вам нужно создать кнопку и макет, вложенные в ScrollView:

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".TasksListActivity">


            <Button
                android:id="@+id/magic_btn"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Magic Btn"/>
            <LinearLayout
                android:id="@+id/magic_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:visibility="gone">

        </LinearLayout>
</ScrollView>

2.- После этого перейдите к соответствующему JAVA, найдите кнопку и установите onClickListener, внутри onClickListener вы найдете макет.

Button findMagicBtn = (Button) findViewById(R.id.magic_btn);
        findMagicBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

            }
        });

3.- Итак, теперь внутри onClickListener мы найдем макет. Как вы можете видеть на первом шаге, макет по умолчанию устанавливается на GONE, но теперь мы должны установить его на видимое. Проблема в том, как я могу сделать это снова и наоборот? Таким образом, мы добавим условие для получения видимости макета и на основе этого оно будет скрыто или отображаться:

Button findMagicBtn = (Button) findViewById(R.id.magic_btn);
        findMagicBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                LinearLayout findMagicLl = (LinearLayout) findViewById(R.id.magic_layout);
                if (findMagicLl.getVisibility() == View.VISIBLE) {
                    findMagicLl.setVisibility(View.GONE);
                } else {
                    findMagicLl.setVisibility(View.VISIBLE);
                }
            }
        });

Это может быть передано друг другу столько раз, сколько вы захотите.

Итак, если вы действительно хотите, чтобы это выглядело как аккордеон, вы можете сутулиться. Вы можете поместить стрелку справа от нее, используя пример:

findMagicBtn.setCompoundDrawablesWithIntrinsicBounds(0, 0, R.drawable.right_arrow, 0);

Вы должны сделать это внутри onClickListener и использовать условие, чтобы изменить направление стрелки, изменив drawable (если стрелка вниз и вниз, а если видна стрелка вверх).

Кроме того, вы можете сделать его более естественным, добавив анимацию, например:

ScaleAnimation animation = new ScaleAnimation(1f, 1f, 1f, 0f, Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 0f);
animation.setDuration(180);
animation.setFillAfter(true);
findMagicLl.startAnimation(animation);

Вам нужно будет подумать, что вышеупомянутая анимация должна быть выполнена во время видимости. Помните, что setFillAfter(true) будет изменять размер контейнера постоянно, поэтому, если вы это сделаете, возможно, вы больше не хотите использовать VIEW.GONE. Этот вопрос имеет замечательное объяснение Масштабирование анимации