1.先添加一下anko

依赖:implementation "org.jetbrains.anko:anko:$anko_version"

版本:ext.anko_version='0.10.8'

2.新建Activity和Fragment的两个基类,方便以后使用

abstract class BaseActivity: AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(getLayoutId())
initData();
onListener();
} abstract fun getLayoutId(): Int;//继承此类必须先实现此方法 protected open fun initData(){ } protected open fun onListener() { }

//

abstract class BaseFragment:Fragment() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
initData()
}
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
return initView();
} override fun onActivityCreated(savedInstanceState: Bundle?) {
super.onActivityCreated(savedInstanceState)
onListener()
} abstract fun initView():View? protected open fun initData(){ } protected open fun onListener(){ }
}
3.底部导航
方案一:bottombar
依赖:implementation 'com.roughike:bottom-bar:2.3.1'
activity_main.xml改成LinearLayout布局,设置垂直布局
<FrameLayout
android:id="@+id/contentContainer"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"/> <com.roughike.bottombar.BottomBar
android:id="@+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="56dp"
app:bb_tabXmlResource="@xml/bottombar_tabs"/>
新建xml Directory,添加bottombar_tabs.xml
<?xml version="1.0" encoding="utf-8"?>
<tabs>
<tab
id="@+id/tab_homepage"
icon="@drawable/homepage_icon"
title="主页" />
<tab
id="@+id/tab_favorites"
icon="@drawable/favorites_icon"
title="收藏" />
<tab
id="@+id/tab_message"
icon="@drawable/message_icon"
title="消息" />
<tab
id="@+id/tab_personal"
icon="@drawable/personal_icon"
title="我的" />
</tabs>
添加图标资源到drawable-xxhdpi目录中(不能直接添加到drawable中)
添加监听很简单
    override fun initData() {
bottomBar.setOnTabSelectListener{
//it即是tab的id
// println(it)
}
接下来准备点击切换的四个fragment,都继承自BaseFragment,例如
class FavoritesFragment:BaseFragment() {

    override fun initView(): View? {
var textView:TextView=TextView(activity) //getActivity()返回与之关联的activity
textView.text="收藏"
return textView
}
}
再准备一个管理fragment的类FragmentManage
class FragmentManage {
fun getFragment(tab_id:Int):BaseFragment?{
when(tab_id){
R.id.tab_homepage->return HomePageFragment()
R.id.tab_favorites->return FavoritesFragment()
R.id.tab_message->return MessageFragment()
R.id.tab_personal->return Personal()
}
return null
}
}
优化后的代码,创建单例模式,采用懒加载定义变量
class FragmentManage private constructor(){
val homePageFragmeng by lazy{HomePageFragment()}
val favoritesFragment by lazy{FavoritesFragment()}
val messageFragment by lazy{MessageFragment()}
val PersonalFragment by lazy{Personal()} companion object{
val fragmentManage by lazy{
FragmentManage()
}
}
fun getFragment(tab_id:Int):BaseFragment?{
when(tab_id){
R.id.tab_homepage->return homePageFragmeng
R.id.tab_favorites->return favoritesFragment
R.id.tab_message->return messageFragment
R.id.tab_personal->return PersonalFragment
}
return null
}
}
这里可能找不到id,重启一下就可以了。R资源路径app\build\generated\not_namespaced_r_class_sources\debug\r\com\vocus\justtest
在MainActivity中设置对bottomBar的监听,并动态添加fragment
override fun initData() {
bottomBar.setOnTabSelectListener {
//it即是tab的id
// println(it)
val transAction = supportFragmentManager.beginTransaction()
//transAction.replace(R.id.contentContainer,FragmentManage().getFragment(it) as BaseFragment, it.toString())
transAction.replace(R.id.contentContainer,FragmentManage.fragmentManage.getFragment(it)!!,it.toString())
transAction.commit() }
}
 
效果:
 

 方案二:BottomNavigationView
null
4.主界面,设置HomePageFragment
设置状态栏背景透明
null
广告图片轮播(ViewPager)
设置homepagefragment布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.viewpager.widget.ViewPager
android:id="@+id/vp_homePageAd"
android:layout_width="match_parent"
android:layout_height="300dp">
</androidx.viewpager.widget.ViewPager> <LinearLayout
android:id="@+id/dot_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_centerHorizontal="true"
android:layout_alignBottom="@+id/vp_homePageAd"
android:layout_marginBottom="10dp"> </LinearLayout> </RelativeLayout>
新建HomePageAdAdapter类
class HomePageAdAdapter(): PagerAdapter(){
private val imageViewList=ArrayList<ImageView>()
constructor(imageViewList:ArrayList<ImageView>):this(){
this.imageViewList.addAll(imageViewList)
} override fun isViewFromObject(view: View, `object`: Any): Boolean {
return view==`object`
} override fun instantiateItem(container: ViewGroup, position: Int): Any {
// var textView= TextView(container.context)
// textView.text="test"
// container.addView(textView)
// return textView
container.addView(imageViewList.get(position))
return imageViewList.get(position)
} override fun getCount(): Int {
return imageViewList.size
} override fun destroyItem(container: ViewGroup, position: Int, `object`: Any) {
container.removeView(`object` as View)
}
}
在HomePageFragment中添加代码
  • 重写onListener方法(在onActivityCreated的生命周期里)
  • 定义资源

 var imagesId=listOf(R.drawable.pic1,R.drawable.pic2,R.drawable.pic3,R.drawable.pic4,R.drawable.pic5)

        //定义五个图片控件,用于加载图片资源
var imageViewList=ArrayList<ImageView>()
for(i in 0 until 5){
var imageView:ImageView=ImageView(activity)
imageView.setImageResource(imagesId[i])
imageViewList.add(imageView) }
 
  • 添加监听
//        var vp_homePage:ViewPager=view!!.findViewById(R.id.vp_homePageAd)
// vp_homePage.adapter=HomePageAdAdapter()
vp_homePageAd.adapter=HomePageAdAdapter(imageViewList) // //添加页面改变监听
vp_homePageAd.addOnPageChangeListener(object :ViewPager.OnPageChangeListener{
override fun onPageScrollStateChanged(state: Int) { } //页面滚动的时候
override fun onPageScrolled(
position: Int,
positionOffset: Float,
positionOffsetPixels: Int
) { } override fun onPageSelected(position: Int) {
//添加圆点导航
addDots(position)
} }) }
  • 增加圆点导航方法
//偷懒的方法
fun addDots(position:Int){

        dot_container.removeAllViews()
var dots=arrayOf<TextView>(TextView(activity),TextView(activity),TextView(activity),TextView(activity),TextView(activity))
dots.forEach {
it.text="."
it.setTextColor(Color.GRAY)
it.textSize=30f
} for(i in 0 until 5) {
dot_container.addView(dots[i])
}
dots[position].setTextColor(Color.WHITE) }
The specified child already has a parent. You must call removeView() on the child's parent first
我在把同一个TextView多次添加到布局中发生此错误,因为添加一次之后TextView就有parent了,直接在for循环中使用(textView.parent as ViewGroup?)!!.removeView(textView)也不行,因为循环的第二次会把第一次添加的移除。所以只能创建多个textview
错误代码为:
fun addDots(position:Int){
var dots=ArrayList<TextView>()
var textView=TextView(context)
textView.text="."
textView.setTextColor(Color.RED)
textView.textSize=30f for(i in 0 until 5) {
if ((textView.parent as ViewGroup?) != null) {
(textView.parent as ViewGroup?)!!.removeView(textView)
}
dot_container.addView(textView)
}
}

继续完善

  • 增加无限翻页
将getCount()返回值设置为Integer.MAX_VALUE,资源列表用到position取值的地方,要按5取模position%5,这样可以实现向后无限翻页;为了保证向前也能无限翻页,将PagerView的当前页设置为Integer.MAX_VALUE/2,同时-Integer.MAX_VALUE/2%5保证为5的倍数
vp_homePageAd.currentItem=Integer.MAX_VALUE/2-Integer.MAX_VALUE/2%5
  • 循环播放
val handler: Handler =object:Handler(){
override fun handleMessage(msg: Message) {
super.handleMessage(msg)
vp_homePageAd.currentItem+=1 sendEmptyMessageDelayed(0,4000)
} }
调用:handler.sendEmptyMessageDelayed(0,4000)
var flag:Int?=null
vp_homePageAd.setOnTouchListener(object:View.OnTouchListener{
override fun onTouch(p0: View?, p1: MotionEvent?): Boolean {
//Toast.makeText(context,"-x:${p1.x},y:${p1.y}",Toast.LENGTH_SHORT).show(); when(p1!!.action){
MotionEvent.ACTION_DOWN->flag=0
//MotionEvent.ACTION_UP->flag=1
MotionEvent.ACTION_MOVE->flag=2
}
println(flag.toString())
if(p1!!.action==MotionEvent.ACTION_UP&& flag==0){
val currentPage=vp_homePageAd.currentItem%5
when(currentPage+1){
1->Toast.makeText(context,"1",Toast.LENGTH_SHORT).show()
2->Toast.makeText(context,"2",Toast.LENGTH_SHORT).show()
3->Toast.makeText(context,"3",Toast.LENGTH_SHORT).show()
4->Toast.makeText(context,"4",Toast.LENGTH_SHORT).show()
5->Toast.makeText(context,"5",Toast.LENGTH_SHORT).show() }
}
return false
}

(每次响应点击事件都会调用这个函数,比如按下,松开会调用两次该函数,所以flag应该是个全局变量)

  •  其他未实现
·可以给每个页面添加文字说明
·用户按住某个页面时,应该停止轮播
 效果

源码:

链接:https://pan.baidu.com/s/1zx5IXnD74ySe_bYM9F17xQ
提取码:hmg5

问题补充:

第一次进去程序没有圆点导航,需要初始化一下

Handler函数中调用vp_homePageAd加一个非空判断,因为切换底部导航tab的时候,vp_homePageAd变为空

												

尝试用kotlin做一个app(一)的更多相关文章

  1. 尝试用kotlin做一个app(写在前面)

    学kotlin的目的好像就是做一个app,不一定有什么想做的项目,只是单纯想掌握这一门技术,确切地说只是单纯想学会做app.对于概念的东西,我也没兴趣深究,用得到的学一下,用不到的,就算了.我也不知道 ...

  2. 尝试用kotlin做一个app(二)

    导航条 我想实现的效果是这样的 类似于ViewPager的效果,子类导航页面可以滑动,当滑动某个子类导航页面,导航线会平滑地向父类导航移动 ·添加布局 <!--导航分类:编程语言/技术文档/源码 ...

  3. 尝试用kotlin做一个app(五)

    JSP后台管理系统 开发工具是IntelliJ IDEA+tomcat+mysql5.6.19+mysql-connector-java-5.1.48.jar+easyui+kindeditor 之前 ...

  4. 尝试用kotlin做一个app(四)

    本来是应该为主页加载数据库数据了,但是想着做后台,之前写jsp后台写吐了,所以先拖几天.把之前的代码完善一下,或者添加些新内容. ...... 多个fragment切换卡顿 首先修正一个bug.从主页 ...

  5. 尝试用kotlin做一个app(三)

    新闻列表 添加新闻列表可以使用RecyclerView.但是有个问题,RecyclerView只会在内部滚动,不会带动整个屏幕滚动.所以在原根布局外层添加androidx.core.widget.Ne ...

  6. 做一个 App 前需要考虑的几件事

    做一个 App 前需要考虑的几件事  来源:limboy的博客   随着工具链的完善,语言的升级以及各种优质教程的涌现,做一个 App 的成本也越来越低了.尽管如此,有些事情最好前期就做起来,避免当 ...

  7. 做一个App前需要考虑的几件事

    本文转载于文章原文链接,版本归原作者所有! 随着工具链的完善,语言的升级以及各种优质教程的涌现,做一个 App 的成本也越来越低了.尽管如此,有些事情最好前期就做起来,避免当 App 有了一定规模后, ...

  8. 涨姿势:创业做一个App需要花多少钱(8个人,6个月,就要100万,附笔记心得)

    (原标题:涨姿势:创业做一个App要花多少钱?) 作为互联网从业者,被外行的朋友们问及最多的问题是,“做一个网站需要多少钱?”或者“做一个APP需要多少钱?”. 作为做过完整网站项目和APP的人,今天 ...

  9. [转载]做一个 App 前需要考虑的几件事

    本文转自http://limboy.me/tech/2016/07/06/starting-an-app.html ========================================= ...

随机推荐

  1. gitlab实现webhook触发jenkins 自动,构建,测试,push webhook构子 总结

    最新一直在学习 工作 + 学习 去掉 90%   所以blog  一直没更 真是很不好!  exsi ceph gitlab jenkins harbor k8s  docker-compose ap ...

  2. (转)浅谈 Linux 内核无线子系统

    前言 Linux 内核是如何实现无线网络接口呢?数据包是通过怎样的方式被发送和接收呢? 刚开始工作接触 Linux 无线网络时,我曾迷失在浩瀚的基础代码中,寻找具有介绍性的材料来回答如上面提到的那些高 ...

  3. pytorch & numpy广播法则

    广播法则 所有数组向维度最高的数组看齐,若维度不足则在最前面的维度用1补齐 扩展维度后,所有数组在某一维度相同或者长度为1,否则不能计算 当可以计算时,将长度为1的维度扩展为另一数组相应维度的长度 a ...

  4. window 命令行telnet 不能用问题

    如图 解决办法 打开window控制面板,启用或关闭window功能,勾选telnet选项.

  5. SqlServer查看锁表与解锁

    某些情况下,sqlserver的表会被锁住,比如某个会话窗口有数据一直没提交,窗口又没关闭,这时表就会被锁住 其他任何连接查询表数据时都不会返回 这时需要手工杀掉产生死锁的会话ID,才能恢复正常 查看 ...

  6. 怎样设置使IntelliJ IDEA智能提示忽略大小写?

    打开设置(CTRL+ALT+S)打开editor,找到“Code Completion”->点击Match case前面的框不勾选即可.如下图:

  7. 061、Java中利用return结束方法调用

    01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...

  8. 数据结构第二版之(课后题)BF算法病毒感染检测

    //vs2013下编译通过.换别的编译器自行补充头文件和修改源代码#include<iostream> #include<fstream> #include <strin ...

  9. 标准C的标记化结构初始化语法

    1 struct file_operations { 2         struct module *owner; 3         loff_t (*llseek) (struct file * ...

  10. UVA - 536 Tree Recovery (二叉树重建)

    题意:已知先序中序,输出后序. #pragma comment(linker, "/STACK:102400000, 102400000") #include<cstdio& ...