使用Kotlin仿的簡書個人主頁，只需一個控件

界面做的比較丑，但是基本上實現了功能。
為了學習最近比較火的kotlin語言，就試著寫了個demo。

參考上篇文章仿掌上英雄聯盟的效果。

效果圖
一、開始前的準備

  • 導入kotlin開發環境：
    在androidStudio3.0版本默認已經集成好了。直接在創建項目的時候勾選include Kotlin support，會自動幫我們創建好kotlin語言的項目。不勾選就是java。

    image.png

  • 如果是手動集成kotlin：
    需要兩個地方進行配置
    1、根目錄下的 project - build.gradle

buildscript {
    ext.kotlin_version = '1.1.2-4'
....//省略部分代碼
   }
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.3.0'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }

2、model - build.gradle

apply plugin: 'kotlin-android'
apply plugin: 'kotlin-android-extensions'

dependencies {
    compile "org.jetbrains.kotlin:kotlin-stdlib-jre7:$kotlin_version"
 .....//省略部分代碼
}

需要注意的是如果是自動集成的默認沒有apply plugin: 'kotlin-android-extensions'
該方法需要手動添加，關于用處后面再說。

二、加入控件，創建布局

前面說的一個控件就是指scrollablelayout，在GitHub已經開源很久了。
已經提供好了折疊所需要的布局。

 compile 'com.github.cpoopc:scrollablelayoutlib:1.0.1'

Scrollable需要三個子view，來分別展示：折疊的部分、標題部分、滾動的部分。

仿簡書個人中心

所以布局中大體就是一個標題欄+一個ScrollacleLayout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context="com.wapchief.kotlin.MainActivity">
    <!--標題欄-->
    <include layout="@layout/action_bar"/>
    <!--包裹三個View-->
    <com.cpoopc.scrollablelayoutlib.ScrollableLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white"
        android:orientation="vertical">
        <!--header-->
        <include layout="@layout/main_header" />
        <!--tab-->
        <include layout="@layout/main_tablayout" />
        <!--footer-->
        <android.support.v4.view.ViewPager
            android:id="@+id/vp"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </com.cpoopc.scrollablelayoutlib.ScrollableLayout>

</LinearLayout>

這里的布局跟java的一樣，按正常的方式寫就好。主要是在activity中的變化。

三、在activity中實例化
  • 實例化控件：
    和java不同的是kotlin不需要通過findviewby來獲取控件。java中如果存在多個視圖文件布局就要創建多個view，比如這里我用的都是lnclude，如果是java中就要創建四個view對象。再分別實例化。
    在kotlin中提供了更加簡潔的方法 : 直接通過導入包的形式來拿到控件，
import kotlinx.android.synthetic.main.activity_main.*
import kotlinx.android.synthetic.main.action_bar.*
import kotlinx.android.synthetic.main.main_tablayout.*
import kotlinx.android.synthetic.main.main_header.*

這樣就直接拿到了所有用到的view中的所有控件,.*就是實例化View中所有的id，
如果想實例化單個id，就是import kotlinx.android.synthetic.main.main_header.id。

  • 在通過kotlinx實例化的時候，剛開始遇到一個問題就是找不到該方法，后來查到是因為androidStudio自動創建的kotiln沒有apply plugin: 'kotlin-android-extensions'這一行代碼。
    所以在創建項目的時候要檢查是否存在。

  • 初始化fragment：
    由于在viewpager切換用到了fragment，所以要創建一個存放fragment的集合

var fragments: MutableList<Fragment> = ArrayList<Fragment>()
        fragments.add(Fragment1())
        fragments.add(Fragment1());
        fragments.add(Fragment1());

和java不同的是，kotlin使用的是MutableList，并且變量名是在前的，
并且添加Fragment的時候也不需要new Fragment對象，是不是簡潔了很多。

  • 關聯viewpager:
    在kotlin中已經幫我們簡化了很多get、set方法，比如setAdapter直接調用adapter 就可以使用，如果要設置控件的顯示或隱藏就是header_1.visibility=View.GONE 
vp.adapter=viewPagerAdapter(supportFragmentManager,fragments)

viewpager需要一個適配器，使用內部類創建一個viewPagerAdapter，
fm和list分別為參數，FragmentManager和List<Fragment>為類型，
FragmentPagerAdapter相當于extend FragmentPagerAdapter繼承了該類。

 //繼承 FragmentPagerAdapter 創建適配器
    class viewPagerAdapter(fm: FragmentManager?, var list: List<Fragment>) : FragmentPagerAdapter(fm) {
        override fun getItem(position: Int): Fragment {
            return list.get(position)
        }

        override fun getCount(): Int {
            return list.size
        }
    }
  • 監聽view pager事件：
    這里要監聽viewpager，實現切換Framgment切換的效果
    重寫onPagerSelected方法。
    when就是循環相當于switch case語句
    如果只執行一個方法就不需要加{}
override fun onPageSelected(position: Int) {
                //判斷滑動后選擇的頁面設置相應的標簽被選中
                when (position) {
                    0 -> {
                        initTabLayout(tab1_tv, tab1_v)
                        clearTabLayout(tab2_tv, tab2_v)
                        clearTabLayout(tab3_tv, tab3_v)
                    }
               
                    1 -> {
                        initTabLayout(tab2_tv, tab2_v)
                        clearTabLayout(tab1_tv, tab1_v)
                        clearTabLayout(tab3_tv, tab3_v)
                    }
                    2 -> {
                        initTabLayout(tab3_tv, tab3_v)
                        clearTabLayout(tab2_tv, tab2_v)
                        clearTabLayout(tab1_tv, tab1_v)
                    }
}

控件不需要實例化，在方法中定義好控件的類型，需要調用的時候直接傳遞控件id，在引用資源id,同樣的例子：resources替代了java中的getResources

 /*初始化tab標簽*/
    private fun initTabLayout(tv: TextView,tv2: TextView) {
        tv.setTextColor(resources.getColor(R.color.tab_select))
        tv2.setBackgroundColor(resources.getColor(R.color.tab_select))
    }
    /*重置tab標簽顏色*/
    private fun clearTabLayout(tv: TextView,tv2: TextView){
        tv.setTextColor(resources.getColor(R.color.tab_clear))
        tv2.setBackgroundColor(Color.WHITE)
    }
  • 最后用到的就是監聽:
    也是最常用的方法之一，kotlin中實現監聽不需要實例化監聽事件，直接使用一行代碼調用就實現了監聽操作
tab1.setOnClickListener {
            vp.setCurrentItem(0)
            initTabLayout(tab1_tv, tab1_v)
            clearTabLayout(tab2_tv, tab2_v)
            clearTabLayout(tab3_tv, tab3_v)
        }
四、Fragment設置假數據

在寫demo用的大多都是假數據，方便查看效果，都是通過for循環實現數據的遞增添加

    private fun getData(): List<String> {

        val data = ArrayList<String>()
        for (i in 0..30) {
            data.add(i,"測試數據："+i)
        }
        return data
    }
END

試著用Kotlin寫了一個小demo，對比java感覺精簡是kotlin的一大特點，能讓開發者節省更多的時間，并且語法也非常好理解。有點與php類似。對于android開發者來說上手很容易。

相關資源：

最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容