学习笔记-Kuaihu(仿知乎日报)
Posted 一步一个脚印
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了学习笔记-Kuaihu(仿知乎日报)相关的知识,希望对你有一定的参考价值。
本文目的:由于第一次学习较为完整的项目,故作记录以系统地整理APP开发知识
先看看整个项目结构:
- activity, fragment, 不用说了。可以看做MVC中的controller
- db, 存储json缓存用的,model就是一些bean类比如首页Item的对象,点开详情的文章对象
- util嘛一些工具类。里面可以对已有的HTTP工具再次进行封装。
- view就是一些自定义的或者第三方view类。
- Kpplication就是自己写的application类,里面进行了第三方工具的初始化,其他没什么。
manifest也很简单。就是网络请求、网络状态、和写外部存储的权限(有了写,默认就可以读)。
我们从splashActivity开始看起:
- 先用FULLSCREEEN和HIDE_NAVIGATION两个给decorView设置上
- 初始化启动图imageview,getFileDir获得splash.jpg, 文件不存在则用默认图,存在则用BitmapFactory.decodeFile(splashFile.getAbsolutePath() )解析该文件
- 不管splash存不存在,我们都要进行get请求,获得最新的启动图的url,拿着这个url我们再次进行请求,并把该图片保存成文件。
- 此时我们主线程在播放启动图的动画:
- 在anim文件夹下写scale动画,或者直接在代码new一个ScaleAnimation对象
- fillAfter: true表示动画结束后图像persist;fromXScale和toXScale表示从多少倍放大到多少倍。pivotX="0.5"表示从X轴的中心开始效果
- 设置Duration为3000毫秒,然后加上setAnimationListener,onAnimationEnd中写上动画结束后的操作。
- 动画完成进入MainActivity, 通过overridePendingTransition更改进入activity的动画。调用finish()干掉启动页。
然后我们到了MainActivity:
- 首先看看布局,这里用的是Drawerlayout, 主布局放在上面,menu布局放在下面(menu这里用的fragment,我们应该替换成design库的navigationView)
- 看看onCreate代码。首先当然是初始化View了,这里根据是否是夜间模式,toolbar和statusBar的颜色进行了初始化。
- 主布局由toolbar和SwipeRefreshLayout组成,所以要对swipeRefreshLayout进行初始化,这里设置了颜色,和onRefreshListener
- 此处onRefresh中简单地new了一个MainFragment,目测可以优化。刷新结束需要调用setRefreshing(false),这个方法会移除刷新的圆环。
- 然后配置了ActionBarDrawerToggle,吧drawerlayout和toolbar关联起来。mDrawerlayout.setDrawerListener(drawerToggle).
- 最后就是用mainFragment来replace主布局啦。记得加上tag哦
- 接 着往下看,我们会看到MainActivity包含很多跟UI有关的操作,比如关闭drawer, 设置SwpieRfreshEnable,toolbar的setTitle,但是mainActivity实际上没调用过。这些方法写成public, 然后我们在mainFragment中获得mActivity对象,就可以方便的调用。mActivity在baseFragment中获得就行了。
- 还 有一个onOptionsItemSelected(MenuItem item)就是来监听menu的点击事件啦。这里主要是一个夜间模式,通过改变toolbar的backgroundColor和 setStatusBarClor,通过findFragmentByTag或者Id找到主fragment和内容fragment,调用其 updateTheme方法(fragment中解释),然后记得把夜间模式保存到sharedPreference就行了。
- 最后理所当然的复写了onBackPressed方法实现按两次退出的效果。记得先关闭drawer;用到snackbar, 记得根据夜间模式可以来setBackgroundColor
接下来就是比较重要的MainFragment:
- 布局嘛不用说就是一个listView或者recyclerView。后者通过判断itemType可以加载不同的布局达到header或者footer的效果
- 这里header是一个图片循播的控件。里面包含TopEntities(放在顶部的一些文章对象),点击事件就跟其他的Item一样了,都是用intent传递id和title来打开详情页。
- 然后就是list的初始化,用setOnScrollListener控制滑动到最后几项时来加载更多(第一次加载是加载今天的,加载更多中拿到日期来查询历史文章就行)
- item点击事件和header中一样的,传递一个带有id和title的entity过去,打开详情页的activity。
- 然 后看看数据加载:-如果有网络:请求news/latest的文章数据,获取数据后通过SQLiteOpenHelper来 getWritableDatabase.执行SQL语句保存json数据。缓存json数据后,就要解析了。我们根据不同的json数据创建对应的对 象。这里是Latest文章对象类(用GsonFormat工具很方便)。new一个Gson, 把response的String和Latest.class传入,于是我们就方便地获得了一个Latest对象, 对象里面有对应的方法获得一个ArticleEntities的数组,把他加到list的adapter中,通知一下(添加和通知的方法可以封装)就OK 了。
- -如果没有网络:获得SQLiteOpenHelper以getReadableDatabase,对 SQLiteDatabase进行rawQuery,返回cursor,用cursor来找到json数据。。具体流程不太清楚。准备用第三方的ORM数 据库greenDao。
- 再看看加载更多方法:加载更多是写在list的onScroll中的。判断滚动到最后倒数第二个就可以执行了。拿着json中的date,对news/before这个API进行请求即可。解析的时候传入的是Before.class,也就是历史文章对象,其他一样。
- 最后是updateTheme也就是夜间模式方法。调用的是list的adapter中的同名方法。这个方法只是重新获取了isDarkMode这个值,然后notifyDataSetChanged(这么简单就行了?有连锁反应?)
看看MainFragment中list的Adapter:
- 首先这是继承自baseAdapter的,构造方法就一个context(数据通过自己写的addList方法传入文章对象的List)
- 然后看看updateTheme:先获得了isDarkMode值,然后notifyDataSetChanged(..这句话我是不是说过?)
详情页的Activity:
- 详情页是通过webView显示的。根布局是CoordinatorLayout,我称之为协调布局。然后依次是AppBarLayout包裹着 CollapsingToolbarLayout, 正如名字一样,CollapsingToolbarLayout中,应有一个Toolbar, 而imageview放在toolbar上面(固定格式);AppBarLayout下面是content布局(可以用include方法包含进去),它 是一个NestedScrollView,看名字,应该是一个带有滑动事件的Scrollview,有一个属性叫layout_behavior, 值是系统自带的固定的string。NestedScrollView中就是一个webview,用来显示主要的文章内容。考你一道题,如果想加入 FloatingActionButton,布局应该放在哪?答案是放在AppBarLayout下方,用 app:layout_anchor="@id/app_bar"和app:layout_anchorGravity="bottom|end"来控制 其位置。
- 首先是喜闻乐见的初始化,从intent中获得文章entity对象(里面包含title和id),然后是toolbar,这 里是第二级activity,所以要setDisplayHomeAsUpEnabled(不觉得这个方法名太长了吗?),然后 setNavigationOnClickListener,里面就是onBackPressed. 然后就是标题栏了。这里要用CollapsingToolbarLayout来设置title。还有个setContentScrimColor和 setStatusBarScrimColor(Scrim是沙罩的意思)。
- 然后就是webview的设置了,先 getSettings获得webSettings对象,setjavascriptEnabled不解释了,别随便 开;setCachemode(WebSettings.LOAD_CACHE_ELSE_NETWOR), 有cache就加载,没有就network;setDomStorageEnabled、setDatabaseEnabled、 setAppCacheEnabled统统开启,虽然不知道有什么效果。
- 初始化完成就如果有网可以进行网络访问了,拿到文章对象entity的id,直接访问news/,获得数据后,以id为key,response作为value。保存在数据库。没有网的话老规矩,以id来查询json数据,并进行解析。
- 解析:还是先根据json数据写好文章Content对象,new个Gson,用fromJson方法传入json数据和Content.class, 然后你就获得Content对象啦
- 首先用图片加载器把图片加载了,url直接从content对象中get就行了;然后是webview的加载:就是html的字符串头部加上css的样式,这里样式是固定的,所以放到了assets文件中:
String html = "<html><head>" + css + "</head><body>" + content.getBody() + "</body></html>"; html = html.replace("<div class=\"img-place-holder\">", ""); mWebView.loadDataWithBaseURL("x-data://base", html, "text/html", "UTF-8", null);
以上是关于学习笔记-Kuaihu(仿知乎日报)的主要内容,如果未能解决你的问题,请参考以下文章