Kotlinkotlin我和简书那些事儿

使用Kotlin仿的简书个人主页,只需一个控件

2017-07-04  本文已影响555人  八怪不姓丑

界面做的比较丑,但是基本上实现了功能。
为了学习最近比较火的kotlin语言,就试着写了个demo。

参考上篇文章仿掌上英雄联盟的效果。

效果图
一、开始前的准备
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中实例化
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

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

和java不同的是,kotlin使用的是MutableList,并且变量名是在前的,
并且添加Fragment的时候也不需要new Fragment对象,是不是简洁了很多。

vp.adapter=viewPagerAdapter(supportFragmentManager,fragments)

viewpager需要一个适配器,使用内部类创建一个viewPagerAdapter,
fmlist分别为参数,FragmentManagerList<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
        }
    }
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)
    }
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开发者来说上手很容易。

相关资源:

上一篇 下一篇

猜你喜欢

热点阅读