Android Study Material Design 七 之 谈谈ToolBar以及SearchView

LZ-Says:你就像风来了,又走,我的心,满了,又空。。。

这里写图片描述


前言

话说,有的小伙伴可能会问了,ToolBar和SearchView和你说的Material Design有关系么?

嘿嘿,要说有关系也有,要说没关系也没关系,原谅LZ这模凌俩可的回答吧。正好最近在研究这个东西,正好一并归为Materual Design系列了。欢迎拍砖,待LZ在下面将会为大家进行简单说明~

这里写图片描述


本文目标

阅读完本文,你可收获如下:

  • 掌握ToolBar以及SearchView用法;

简述 ToolBar以及SearchView

不知道大家对ActionBar还有木有印象,接下来将简述说明ToolBar与ActionBar之间小私密~

  • 首先,ActionBar为谷歌在Android 3.0 推出,主要作用便是用于APP标题,同样也是用于导航类型;

  • ToolBar则由谷歌在Android 5.0 推出,主要是替代ActionBar。ActionBar拥有Material Design效果,其高度可拓展性让我们可以自由定制想要的效果。

为了让ToolBar有更好的兼容性,谷歌将其放置在V7兼容包中,使其可以向下进行兼容。

而SearchView,这个东西好比某东,某宝首页标题中间搜索框,主要配合ToolBar使用,当然,你也可以自己随便玩喽~

这里写图片描述


先来撸一个ToolBar

1. 撸之前,需要导入依赖,这个似乎都成了标配,But,貌似强大的死丢丢默认导入了。

implementation ‘com.android.support:appcompat-v7:26.1.0’

关于implementation这块,将会在文末为大家介绍,莫急~

2. 修改主题

    <style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
        <!-- Customize your theme here. -->
        ...
    </style>

而关于修改主题,方式其实有很多,简单说下:

  • 第一种: style中设置NoActionBar;

  • 第二种: style中设置item;

这里写图片描述

  • 第三种: Activity中设置;

这里写图片描述

以上方式,自己随便选~

3. 引入布局

    <android.support.v7.widget.Toolbar
        android:id="@+id/id_toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"  // 背景跟随系统属性
        app:logo="@mipmap/ic_launcher_round" // 设置Logo
        app:navigationIcon="@android:drawable/ic_delete" // 设置导航Icon
        app:subtitle="静心Study" // 子标题 
        app:title="腾讯新闻" /> // 标题

当然,ToolBar的属性还有很多,这里就不一一细说了,大家有兴趣可以自行了解下~

4. 初始化,设置监听

    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mToolbar = findViewById(R.id.id_toolbar);
        // 将ActionBar替换为Toolbar
        setSupportActionBar(mToolbar);
        // 设置navigationIcon监听事件
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "返回", Toast.LENGTH_SHORT).show();
            }
        });
    }

5. 查看结果

这里写图片描述


挑剔的小伙伴说了,这特么是啥,黑不拉几的,换个色儿。

这里写图片描述

这里为大家说明下,当初我们设置的跟随系统颜色,还记得LZ之前写的 Android Study之Material Design初体验(一)里面有如何通过Style定义全局样式部分么?可否秒懂?

上码~

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

这里写图片描述

最后效果如下:

这里写图片描述


再撸一发 SearchView

不知不觉中,我们撸了一个ToolBar,各位老帖,是不是很easy?

这里写图片描述

我们今天基于ToolBar进行SearchView讲解说明。

1. 添加SearchView

在res下menu目录中新增menu如下:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/action_search"
        android:icon="@android:drawable/ic_menu_search"
        android:orderInCategory="100"
        android:title="搜索"
        app:actionViewClass="android.support.v7.widget.SearchView"
        app:showAsAction="always" />

</menu>

2. 来一波初始化

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_toolbar, menu);
        return true;
    }

小伙子说了,卧槽,这么Easy?

没错,就是这么尿性~当然,还有很多地方是值得我们去优化的。下面一起来看看效果~

这里写图片描述

3. 设置默认呈现搜索框

我们只需要拿到item中SearchView,然后直接通过setIconified即可实现,如下:

        MenuItem item = menu.findItem(R.id.action_search);
        SearchView searchView = (SearchView) MenuItemCompat.getActionView(item);
        // 设置默认呈现搜索框
        searchView.setIconified(false);

看看效果:

这里写图片描述

4. 设置默认呈现搜索框 并且 不可关闭

只需要调用如下一行即可实现:

    // 设置不关闭SearchView
    searchView.setIconifiedByDefault(false);

效果嘛,很是Easy~

这里写图片描述

5. 设置hint

    // 设置Hint以及Hint颜色
    SearchView.SearchAutoComplete searchAutoComplete = (SearchView.SearchAutoComplete) searchView.findViewById(R.id.search_src_text);
    searchAutoComplete.setHint("请输入要搜索内容");
    searchAutoComplete.setHintTextColor(Color.YELLOW);

瞅瞅~

这里写图片描述

PS:

关于这块LZ怎么知道这个,大家可以点进去看看源码,看看布局,很是Easy~

6. 设置监听输入内容 或者 提交输入内容事件

用户输入查询内容时,我们该如何监听呢?如下:

    // 设置提交按钮可见
    searchView.setSubmitButtonEnabled(true);
    // 设置监听事件
    searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
        @Override
        public boolean onQueryTextSubmit(String query) {
            Toast.makeText(MainActivity.this, query, Toast.LENGTH_SHORT).show();
            return false;
        }

        @Override
        public boolean onQueryTextChange(String newText) {
            Log.e("HLQ_Struggle", "--->:" + newText);
            return false;
        }
    });

Look,Look,Look~

这里写图片描述

7. 修改Icon

嫌弃人家Icon不好看,没关系,改Ta~

    ImageView imageView = searchView.findViewById(R.id.search_go_btn);
    imageView.setImageResource(R.drawable.abc_ic_voice_search_api_material);
    imageView.setVisibility(View.VISIBLE);

还需要效果图么?

这里写图片描述


GitHub查看地址

https://github.com/HLQ-Struggle/MaterialDesignStudy


涨姿势 get小技能

1. implementation与compile简述

implementation是Android Studio 3.0后代替compile,作用都是一样,只不过前者相对后者有更多的优势。

以下为大家引入官方对其说明:

Gradle 3.4引入了新的 Java库插件配置,允许您控制依赖项是否发布到使用该库的项目的编译和运行时类路径。Android插件正在采用这些新的依赖配置,迁移大型项目使用它们可以大大减少构建时间。下表帮助您了解您应该使用哪些配置。
新的配置弃用配置行为
implementationcompile当你的模块配置一个implementation 依赖项时,让Gradle知道模块不想在编译时将依赖项泄露给其他模块。也就是说,只有在运行时,依赖才可用于其他模块。使用这种依赖配置代替 api或compile可以导致显着的构建时间改进,因为它减少了构建系统需要重新编译的项目的数量。例如,如果一个 implementation依赖关系改变了它的API,Gradle只重新编译这个依赖项以及直接依赖它的模块。大多数应用程序和测试模块应使用此配置。
apicompile当一个模块包含api依赖关系时,让Gradle知道模块想要将该依赖关系可传递地导出到其他模块,以便在运行时和编译时使用它们。这个配置的行为就像compile(现在已经被弃用了),你通常应该只在库模块中使用它。这是因为,如果api依赖项更改了外部API,Gradle会在编译时重新编译所有有权访问该依赖项的模块。所以,拥有大量的api依赖可以大大增加构建时间。除非你想将一个依赖的API暴露给一个单独的测试模块,implementation 依赖。
compileOnlyprovidedGradle仅将编译类路径添加到编译类路径(它不会被添加到编译输出)。这在创建Android库模块时非常有用,并且在编译期间需要依赖项,但是在运行时存在则是可选的。也就是说,如果你使用这个配置,那么你的库模块必须包含一个运行时条件来检查依赖是否可用,然后适当地改变它的行为,所以如果没有提供,它仍然可以运行。这有助于减少最终APK的大小,而不会增加不重要的瞬态依赖关系。这个配置的行为就像provided(现在已被弃用)。
runtimeOnlyapkGradle将依赖关系添加到构建输出中,以便在运行时使用。也就是说,它不会被添加到编译类路径中。这个配置的行为就像 apk(现在已被弃用)。
与以前版本的Android插件的依赖配置类似 ,上述配置可用于风格或构建类型特定的依赖关系。例如,您可以使用它implementation来使所有变体都可用,或者可以debugImplementation使其仅debug用于模块的变体。

注: compile,provided以及apk 目前仍然可用。但是,他们将在Android插件的下一个主要版本中被删除。


赞赏

如果觉得LZ写的对你有所帮助,可以请LZ喝点东西,一分也是爱呀~

这里写图片描述


参考文献

  1. https://developer.android.google.cn/studio/build/dependencies.html#library_dependency_configurations
  2. https://developer.android.google.cn/studio/build/gradle-plugin-3-0-0-migration.html

border="0" width="330" height="86" src="//music.163.com/outchain/player?type=2&id=516657051&auto=1&height=66"></center></p>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

HLQ_Struggle

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值