Kotlin学习之旅(D13)-第一个App之功能完善

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.blue.notekeeper.MainActivity">
    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="@string/action_settings"
        app:showAsAction="never" />
</menu>

这个时候只有一个item,我们加入Next Item

    <item
        android:id="@+id/action_next"
        android:checkable="true"
        android:enabled="true"
        android:icon="@drawable/ic_forward_white_24dp"
        android:title="Next"
        android:visible="true"
        app:showAsAction="ifRoom|withText" />

创建icon的方式和前面创建其他图标是一样的

drawable文件夹右键 -> new -> Vector Asset
在Clip Art 选项中选择 forward
把颜色设置为白色

也可以看图片：

注意：app:showAsAction=“ifRoom|withText” 的意思就是 当屏幕空间足够的时候，这个item会显示到ActionBar 具体效果大家可以运行项目，然后 切换屏幕方向 就懂了

横屏的时候Next的图标和文字都会显示出来
竖屏的时候Next只有图标显示出来，文字由于空间不足就隐藏起来了

修改MainActivity

xml文件搞定以后，我们就要开始在代码中处理逻辑了

Menu提供了两个方法给我们处理menu item的相关逻辑

onPrepareOptionsMenu() - 这个方法很常见，在item被点击的时候会触发，因此我们在这里做对应的点击事件的处理
onPrepareOptionsMenu() - 这个方法可能用的比较少，在item还未初始化之前会被调用，因此我们可以在这里做一些准备工作，例如对item图标的更换，点击事件的控制等，接下来大家就知道为什么要重新这个方法了

重写onPrepareOptionsMenu()

    override fun onOptionsItemSelected(item: MenuItem): Boolean {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        return when (item.itemId) {
            R.id.action_settings -> true
            R.id.action_next -> {
                moveNext()
                true
            }
            else -> super.onOptionsItemSelected(item)
        }
    }

知识点：when 表达式

moveNext()

    private fun moveNext() {
        ++notePosition
        displayNote()
        invalidateOptionsMenu()
    }

每一次点击 next 按钮，我们先让记录当前笔记位置的变量notePosition +1，然后再显示下一条笔记，这个方法已经在昨天的文章里实现了，最后就是调用invalidateOptionsMenu() 方法。

重写onPrepareOptionsMenu()

在没有重写这个方法之前，如果我们不停的点击next,到了最后一条笔记的时候，再点击next，app会crash，原因就是数组下标越界了。这个问题很容易解决，就是当我们已经显示了最后一条笔记时，next按钮变成一个不可点击的状态，如图：

在onPrepareOptionsMenu()方法里面，我们通过当前的位置来进行判断是否需要变更图标

 override fun onPrepareOptionsMenu(menu: Menu?): Boolean {
        if (notePosition>= DataManager.notes.lastIndex){
            val menuItem = menu?.findItem(R.id.action_next)
            if (menuItem != null){
                menuItem.icon = getDrawable(R.drawable.ic_block_white_24dp)
                menuItem.isEnabled = false
            }

        }

        return super.onPrepareOptionsMenu(menu)
    }

如果还没到最后一条笔记，那么就显示next，否则的话就显示block，并且设置为不可点击。

关于如何生成 block icon，这里就不重复了，步骤和上面生成Next图标是一样的

最后再运行一遍App，看一下效果，应该就和Day11那篇文章开头的动图是一样的了。

总结

在这个笔记App中，我们实现了以下功能：

新增笔记
查看和编辑笔记
通过Next查看下一条笔记
横竖屏切换时保存笔记状态

但是其实还有许多可以改进的地方，例如：

删除笔记（List 左滑 / 长按 / 进入编辑页面删除等等）
优化控件（RecyclerView 替换 ListView）
优化界面（让笔记通过卡片形式展示，加入点击和过场动画，使用不同颜色的字体等等）
优化笔记功能（可以插入图片，url，等额外的信息）

有兴趣的童鞋可以在此基础上继续开发~通过实战提高自己的技术！！

不过我们Kotlin学习之旅的目的还是达到了，虽然只是一个简单的半成品App，通过前期学习Kotlin的语法和特性，然后到一步步写出这个App，这个过程中的成就感还是非常大的，同时也让自己对Android和Kotlin得以一直保持热度和兴趣。

明天就是Kotlin学习之旅的最后一天了，我会做一个Kotlin学习资料的总结，包括文档，博客，视频，Github的开源项目等

Day 13 - Learn Kotlin Trip， Completed.

blue_zy

发布了55 篇原创文章 · 获赞 37 · 访问量 14万+

私信关注