Android Design Support Library 都有哪些新特性以及如何使用它的 Snackbar?

Posted

技术标签:

【中文标题】Android Design Support Library 都有哪些新特性以及如何使用它的 Snackbar?【英文标题】:What are the new features of Android Design Support Library and how to use its Snackbar?Android Design Support Library 有哪些新特性以及如何使用它的 Snackbar? 【发布时间】:2015-08-11 18:59:55 【问题描述】:

面向开发者的 android M 预览版于昨天发布。像往常一样,引入了许多惊人的新功能。我注意到Snackbar 就是其中之一。

看了Snackbar的文档,得知Snackbar在Android Design Support Library的库中,其绝对路径为android.support.design.widget.Snackbar

文件说:

Snackbars 提供有关操作的轻量级反馈。他们展示 手机屏幕底部和左下方的简短消息 在较大的设备上。 Snackbars 出现在所有其他元素之上 屏幕,一次只能显示一个。

它们会在超时或用户交互后自动消失 屏幕上的其他地方,尤其是在召唤 新的表面或活动。小吃条可以从屏幕上滑出。

那么,Snackbar 的行为是像 Toast 还是 Dialog?可以在布局文件中使用 Snackbars 吗?如何以编程方式使用它?

附注:

我们将不胜感激任何有关使用 Snackbar 的示例。 Android 设计支持库是一个新的支持库,可以 有人告诉我这个图书馆的更多细节吗?

【问题讨论】:

你可以看到:github.com/MrEngineer13/SnackBar 或:github.com/nispok/snackbar 我的意思是来自android design support librarySnackbarandroid.support.design.widget.Snackbar Chris Banes 实际上在不久前发布了一个支持库的演示 plus.google.com/+ChrisBanes/posts/7xPXwAZnndn 这是 github 存储库 github.com/chrisbanes/cheesesquare 是的,我找到了。 Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG).setAction("Action", null).show();。不要那么刻薄。男人。 【参考方案1】:

新的Snackbar不需要Android-M

它位于新的设计支持库中,您现在就可以使用它。

只需更新您的 SDK,在您的代码中添加此依赖项:

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

你可以使用这样的代码:

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

就像吐司。

指定操作,您必须设置OnClickListener

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

如果您想更改背景颜色,您可以使用以下内容:

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

如果您想拥有一些内置功能,例如 滑动关闭 手势或 FAB 滚动 向上小吃栏,只需使用 @987654322 @ 在您的视图层次结构中。

【讨论】:

那么,Snackbar 只能在view 的底部对齐显示,那么view 的顶部或左侧呢?我如何设置text 的重力,比如 CENTER 或 RIGHT? 但是它确实要求宿主活动是 AppCompat 活动。 @JonnyWright 如果您想要滑动关闭手势,请在布局中使用 CoordinatorLayout。 @GabrieleMariotti 有什么方法可以无限显示 SnackBar 吗?我的意思是它应该只在用户单击快餐栏的操作按钮时才关闭?我想我应该增加时间,但我用一些整数替换 Snackbar.LENGTH_LONG 它表明只有 Snackbar.LENGTH_LONGSnackbar.LENGTH_SHORT @ShajeelAfzal 目前有一个错误。您应该能够在下一个版本中设置自定义持续时间。【参考方案2】:

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();

编辑:

为了改变背景颜色,我使用这样的东西:

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);

像魅力一样工作;-)

【讨论】:

我该如何设置Snackbar的背景颜色或drawable? 要更改文本颜色,只需在 snack 上使用 setActionTextColor() ..澄清一下,这是针对动作文本的颜色,而不是针对零食文本本身 很遗憾谷歌开发者不支持像在库中改变背景颜色这样琐碎的事情 为“findViewById(android.R.id.content)”加一个【参考方案3】:

对于Snackbar,它的作用类似于Toast,但与Toast 不同。 Snackbars 显示在屏幕底部,其中包含带有可选单个操作的文本。它们会在给定的时间长度后通过屏幕上的动画自动超时。此外,用户可以在超时之前将它们刷掉,这比 toasts 强大得多,这是另一种轻量级的反馈机制。

您可以像这样以编程方式使用它:

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's background color;
TextView textView = (TextView)snackbarView .findViewById(android.support.design.R.id.snackbar_text);
textView.setTextColor(Color.BLUE);//change Snackbar's text color;
snackbar.show(); // Don’t forget to show!

注意在make() 的方法中使用 View - Snackbar 将尝试找到它并确保它被锚定到它的底部。

此外,Android Design Support Library 用于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_
        android:layout_
        android:fitsSystemWindows="true">
    <!-- your content layout -->
    <android.support.design.widget.NavigationView
            android:layout_
            android:layout_
            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>

您将通过使用 setNavigationItemSelectedListener() 设置 OnNavigationItemSelectedListener 来获取所选项目的回调。这为您提供了被点击的 MenuItem,允许您处理选择事件、更改选中状态、加载新内容、以编程方式关闭抽屉或您可能想要的任何其他操作。

用于编辑文本的浮动标签

即使是不起眼的EditText 在材料设计上也有改进的空间。虽然单独的 EditText 会在输入第一个字符后隐藏提示文本,但您现在可以将其包裹在 TextInputLayout 中,从而使提示文本成为EditText 上方的浮动标签 ,确保用户在输入的内容中永远不会丢失上下文。除了显示提示之外,您还可以通过调用setError()EditText 下方显示错误消息。

浮动操作按钮

浮动操作按钮是一个圆形按钮,表示界面上的主要操作。设计库的 FloatingActionButton 为您提供单一一致的实现,默认情况下使用主题中的 colorAccent 着色。

由于FloatingActionButton 扩展ImageView,您将使用android:srcsetImageDrawable() 等任何方法来控制FloatingActionButton 中显示的图标。

标签

***导航模式通常用于组织不同的内容分组。设计库的TabLayout 实现了两个固定选项卡,其中视图的宽度在所有选项卡之间平均分配,以及可滚动选项卡,其中选项卡的大小不统一并且可以水平滚动。

可以通过编程方式添加选项卡:

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

如果您想使用ViewPager 在选项卡之间进行水平分页,您可以直接从您的PagerAdapter’s getPageTitle() 创建选项卡,然后使用setupWithViewPager() 将两者连接在一起。这可确保选项卡选择事件更新ViewPager 并且页面更改更新选定的选项卡。

CoordinatorLayout 和应用栏

设计库引入了CoordinatorLayout,这是一种布局,它提供了对子视图之间的触摸事件的额外控制,设计库中的许多组件都利用了这一点。如果您尝试使用 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_
        android:layout_>

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

    <android.support.design.widget.AppBarLayout
            android:layout_
            android:layout_>
   <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 可以响应这些事件,方法是使用孩子的滚动标志来控制他们如何进入(在屏幕上滚动)和退出(在屏幕上滚动)。

设计库、AppCompat 和所有 Android 支持库都是重要的工具,它们提供了构建现代、美观的 Android 应用所需的构建块,而无需从头开始构建所有内容。

【讨论】:

真的很有帮助!我一直在尝试改变 Snackbar 的文字颜色很长一段时间!【参考方案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();

【讨论】:

【参考方案6】:

你见过http://android-developers.blogspot.in/2015/05/android-design-support-library.html吗?

它总结了整个支持库。

【讨论】:

【参考方案7】:

你也可以改变snackbar的文字颜色和背景

 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】:

在android中制作一个10秒的snackbar很简单

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();

【讨论】:

以上是关于Android Design Support Library 都有哪些新特性以及如何使用它的 Snackbar?的主要内容,如果未能解决你的问题,请参考以下文章

程序类型已经存在:android.support.design.widget.CoordinatorLayout$Behavior

带有清除按钮的 Android java android.support.design.widget.TextInputLayout

找不到编译“com.android.support:design-v7:25.0.0”

如何从右到左设计android.support.design.widget.NavigationView?

无法访问类“android.support.design.widget.Snackbar”

Program type already present: android.support.design.widget.CoordinatorLayout$1