Каковы новые возможности библиотеки поддержки дизайна Android и как использовать ее Snackbar?

Android M Preview для разработчиков был выпущен вчера. Как обычно, появилось много удивительных новых функций. Я заметил, что Snackbar является одним из них.

Я прочитал документ о Snackbar, из которого я узнал, что Snackbar находится в библиотеке библиотеки поддержки Android Design, абсолютный путь которой android.support.design.widget.Snackbar.

И в документе говорится, что:

Закуски обеспечивают легкую обратную связь об операции. Они показывают краткое сообщение внизу экрана на мобильном и нижнем левом на более крупных устройствах. Закуски выглядят выше всех других элементов на и только один может отображаться одновременно.

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

Итак, работает ли Snackbar как Toast или Dialog? Может ли Snackbars использоваться в файле макета? Как я могу использовать его программно?

P.S.:

  • Будут оценены любые образцы использования Snackbar.
  • Библиотека поддержки Android Design - это новая библиотека поддержки, которая может кто-нибудь покажет мне более подробную информацию об этой библиотеке?

Ответ 1

Что касается Snackbar, он действует как a Toast, но отличается от Toast. Закуски отображаются в нижней части экрана и содержат текст с необязательным одиночным действием. Они автоматически тайм-аут после заданной продолжительности времени, оживляя экран. Кроме того, пользователи могут удалять их перед таймаутом, который значительно более мощный, чем тосты, еще один легкий механизм обратной связи.

Вы можете использовать его программно следующим образом:

Snackbar snackbar = Snackbar
  .make(parentLayout, R.string.snackbar_text, Snackbar.LENGTH_LONG)
  .setAction(R.string.snackbar_action, myOnClickListener);
snackbar.setActionTextColor(Color.CYAN);
View snackbarView = snackbar.getView();
snackbarView.setBackgroundColor(Color.YELLOW);//change Snackbar background color;
TextView textView = (TextView)snackbarView .findViewById(android.support.design.R.id.snackbar_text);
textView.setTextColor(Color.BLUE);//change Snackbar text color;
snackbar.show(); // Don’t forget to show!

Обратите внимание, что использование представления в методе make() - Snackbar будет пытаться найти его, чтобы оно было привязано к его нижней части.

Что еще, Библиотека поддержки дизайна Android используется для Android 2.1+ (API 7 +), которая имеет представление навигационного ящика, < сильные > плавающие метки для редактирования текста, кнопки с плавающим действием, snackbar, вкладки и что-то в этом роде.

Вид навигации

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

Вы можете использовать его следующим образом:

<android.support.v4.widget.DrawerLayout
        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="match_parent"
        android:fitsSystemWindows="true">
    <!-- your content layout -->
    <android.support.design.widget.NavigationView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/drawer_header"
            app:menu="@menu/drawer"/>
</android.support.v4.widget.DrawerLayout>

Что касается меню ящика, это может быть:

<group android:checkableBehavior="single">
    <item
        android:id="@+id/navigation_item_1"
        android:checked="true"
        android:icon="@drawable/ic_android"
        android:title="@string/navigation_item_1"/>
    <item
        android:id="@+id/navigation_item_2"
        android:icon="@drawable/ic_android"
        android:title="@string/navigation_item_2"/>
</group>

или

<item
    android:id="@+id/navigation_subheader"
    android:title="@string/navigation_subheader">
    <menu>
        <item
            android:id="@+id/navigation_sub_item_1"
            android:icon="@drawable/ic_android"
            android:title="@string/navigation_sub_item_1"/>
        <item
            android:id="@+id/navigation_sub_item_2"
            android:icon="@drawable/ic_android"
            android:title="@string/navigation_sub_item_2"/>
    </menu>
</item>

Вы получите обратные вызовы для выбранных элементов, установив OnNavigationItemSelectedListener, используя setNavigationItemSelectedListener(). Это дает вам элемент MenuItem, который был нажат, позволяя обрабатывать события выбора, изменять статус проверки, загружать новый контент, программно закрывать ящик или любые другие действия, которые могут вам понадобиться.

Плавающие метки для редактирования текста

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

Кнопка плавающего действия

A кнопка плавающего действия - это кнопка с округлением, обозначающая основное действие на вашем интерфейсе. Библиотеки дизайна FloatingActionButton предоставляют единую согласованную реализацию, по умолчанию окрашенную с помощью colorAccent из вашей темы.

Поскольку FloatingActionButton extends ImageView, вы можете использовать android:src или любой из методов, таких как setImageDrawable(), чтобы управлять значком, указанным в FloatingActionButton.

Вкладка

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

Вкладки могут быть добавлены программно:

TabLayout tabLayout = ...;
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));

Если вы хотите использовать ViewPager для горизонтального подкачки между вкладками, вы можете создавать вкладки непосредственно из вашего PagerAdapter’s getPageTitle(), а затем соединить их вместе, используя setupWithViewPager(). Это гарантирует, что события выбора табуляции обновят ViewPager и изменения страницы, чтобы обновить выбранную вкладку.

КоординаторLayout и панель приложений

в библиотеке дизайна представлен CoordinatorLayout, макет, который обеспечивает дополнительный уровень контроля над событиями касания между дочерними представлениями, что позволяет многим из компонентов библиотеки Design. Если вы попробуете использовать AppBarLayout, вы можете отредактировать Toolbar и другие представления (например, вкладки, предоставленные TabLayout), чтобы прокручивать события в представлении для сестер, помеченных с помощью ScrollingViewBehavior. Поэтому вы можете создать макет, например:

<android.support.design.widget.CoordinatorLayout
        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="match_parent">

     <! -- Your Scrollable View -->
    <android.support.v7.widget.RecyclerView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
   <android.support.v7.widget.Toolbar
                  ...
                  app:layout_scrollFlags="scroll|enterAlways">

        <android.support.design.widget.TabLayout
                  ...
                  app:layout_scrollFlags="scroll|enterAlways">
     </android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

Теперь, когда пользователь прокручивает RecyclerView, AppBarLayout может реагировать на эти события, используя флаги прокрутки дочерних элементов, чтобы контролировать, как они входят (прокрутка на экране) и выход (прокрутка экрана).

Библиотека Design, AppCompat и вся Библиотека поддержки Android являются важными инструментами в создании строительных блоков, необходимых для создания современного замечательного приложения для Android, без создания всего с нуля.

Ответ 2

Новый Snackbar не требует Android-M.

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

Просто обновите SDK, добавьте эту зависимость в свой код:

compile 'com.android.support:design:22.2.0'

Вы можете использовать такой код:

Snackbar.make(view, "Here a Snackbar", Snackbar.LENGTH_LONG)
        .setAction("Action", null)
        .show();

Это похоже на тост.

enter image description here

Чтобы назначить действие, вы должны установить OnClickListener.

Snackbar.make(view, "Here a Snackbar", Snackbar.LENGTH_LONG)
        .setAction("Action", myOnClickListener)
        .show();

Если вы хотите изменить цвет фона, вы можете использовать что-то вроде этого:

 Snackbar snackbar = Snackbar.make(view, "Here a Snackbar",       
                   Snackbar.LENGTH_LONG);
 View snackBarView = snackbar.getView();
 snackBarView.setBackgroundColor(colorId);
 snackbar.show();

enter image description here

Если вы хотите использовать некоторые встроенные функции в качестве жестов салфетки для отклонения или прокрутки FAB вверх по закутке, просто имея CoordinatorLayout в вашей иерархии просмотров.

Ответ 3

В Activity вы можете использовать:

String s = "SnackBar"
Snackbar.make(findViewById(android.R.id.content), s, Snackbar.LENGTH_LONG).show();

и на Fragment:

Snackbar.make(getView(), s, Snackbar.LENGTH_LONG).show();

Edit:

Для изменения цвета фона я использую что-то вроде этого:

String s = "SnackBar"
Snackbar snack = Snackbar.make(getView(), s, Snackbar.LENGTH_LONG);
View view = snack.getView();
view.setBackgroundColor(Color.YELLOW); 
snack.show();

И для изменения цвета текста (несмотря на тему):

View view = snack.getView();
TextView tv = (TextView) view.findViewById(android.support.design.R.id.snackbar_text);
tv.setTextColor(Color.WHITE);

Работает как шарм; -)

Ответ 4

Я установил кодировку

Snackbar snackbar = Snackbar
        .make(getView(), text, Snackbar.LENGTH_INDEFINITE);

View sbView = Global.alert.getView();
sbView.setBackgroundColor(0xFF000000);

TextView textView = (TextView) sbView.findViewById(android.support.design.R.id.snackbar_text);
textView.setTextColor(Color.WHITE);
textView.setTextSize(30);

Global.alert.show();

Ответ 5

Snackbar также способен отображать значки.

Например: ни в одной сети вы не можете показывать такую ​​закусочную (как это делает Gmail).

SpannableStringBuilder builder = new SpannableStringBuilder();
    builder.append(" ").setSpan(new ImageSpan(this, R.drawable.snackbar_icon), 0, 1, 0);
    builder.append(" No Network Available");
    Snackbar snackBar = Snackbar.make(findViewById(R.id.co_ordinate), builder, Snackbar.LENGTH_LONG);
    snackBar.setAction("RETRY", new View.OnClickListener() {
        @Override
        public void onClick(View v) { //Retry Code here 

        }
    });
    snackBar.show();

Ответ 7

вы также можете изменить цвет текста и фон закуски

 Snackbar snackbar = Snackbar.make(view, "Text",
                            Snackbar.LENGTH_LONG);
                    View snackBarView = snackbar.getView();
                    TextView tv = (TextView) snackBarView.findViewById(android.support.design.R.id.snackbar_text);
                    tv.setTextColor(ContextCompat.getColor(MainActivity.this, R.color.colorAccent));
                    snackBarView.setBackgroundColor(ContextCompat.getColor(MainActivity.this, R.color.colorPrimaryDark));
                    snackbar.show();

Ответ 8

Очень просто сделать snackbar в android на 10 секунд

Snackbar.make(view, "Hello SnackBar", Snackbar.LENGTH_LONG)
                    .setAction("Its Roy", new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {

                        }
                    })
                    .setDuration(10000)
                    .setActionTextColor(getResources().getColor(R.color.colorAccent))
            .show();