手把手教你仿一個知乎日報Android客戶端(一)多圖

本文為作者原創(chuàng),轉(zhuǎn)載請注明出處[@大蘑菇的博客][1]
圖片托管服務由貼圖庫提供

作為一只網(wǎng)蟲,肯定是經(jīng)常泡在網(wǎng)絡(luò)的海洋里,有一天偶然看到了知乎日報的API,各方面接口都還挺全面,于是本著“不用白不用”的真理,我決定仿一個知乎日報Adnroid客戶端。

一、功能分析

[知乎日報下載][2]
在正式開始前,我們需要對知乎日報有一個充足的了解,現(xiàn)在我們來分析一下知乎日報是由哪些部分組成的。

1.啟動頁

我們可以看到,啟動頁由一張圖片以及下半部分的logo+APP名組成(我也不知道這個該怎么叫)
所以在我們開發(fā)的時候,也需要這樣一個頁面。
那么這個頁面做些什么事情呢?

1.加載封面圖片:

經(jīng)過較長一段時間的使用, 我發(fā)現(xiàn)每次啟動時該頁面的圖片都不同,有時是圖片有時是廣告,所以這張封面圖片應該來源于網(wǎng)絡(luò),

2.初始化第一個頁面的數(shù)據(jù):

預先加載Home頁的數(shù)據(jù),以便于Home啟動時就可以展示內(nèi)容

二.主頁

由于知乎日報是一個閱讀類的APP,所以布局也和許多新聞閱讀類APP相似,最上方一個標題欄,然后接著是一個banner,然后再往下就是各條內(nèi)容的列表了。

主頁

1.標題欄:

我們先來看下標題欄部分,在標題欄的左側(cè),有一個menu的按鈕,關(guān)于這個menu我們接下來會講到,然后就是標題欄最應該有的標題,白色字體,以及右邊的一個通知logo,一個豎著的...(更多?)

2.Banner:

一個會自動滾動的圖文(?)

3.文章列表:

嗯,就是一個文章列表,點一下就進去了。

三.文章詳情

點擊文章列表或者banner中的任意一個,我們都可以直接進入文章詳情頁面

文章詳情

1.內(nèi)容瀏覽:

通過上下滑動,我們可以很方便的查看文章的內(nèi)容
內(nèi)容包括頂部的一張圖片,以及標題還有下方的內(nèi)容。

2.瀏覽切換:

當我們閱讀完任何一篇文章想要瀏覽下一篇的時候,無需返回重新點擊了,可以在此頁面直通過側(cè)滑切換,不過需要注意的是,在列表的第一篇和最后一篇是無法切換出前一篇和后一篇的

瀏覽切換

3.分享:

一個分享頁面的彈窗,如下圖。

分享

4.收藏:

登錄后,點擊收藏,它就收藏了。。

5.查看評論:

查看并且發(fā)表對這篇文章的評論。

查看評論

6.點贊:

就是贊+1咯。。。

7.返回:

一個back鍵

四.側(cè)滑菜單

可以看到,側(cè)滑菜單由一個登錄按鈕,一個我的收藏,一個離線下載,以及下面的各類型欄目列表組成。

側(cè)滑菜單

1.登錄:

就一個登錄頁面,需要使用新浪微博或者騰訊微博登錄,大概是為了便于分享到微博吧。

登錄

2.我的收藏:

以我的賬號為例,收藏了以下六條日報。

我的收藏

3.離線下載:

點擊離線下載,在本地生成這些文章列表的緩存,以后在無網(wǎng)絡(luò)或者無wifi的狀態(tài)下可以直接瀏覽。

4.文章欄目:

點擊文章欄目可以使頁面顯示該欄目下的各篇文章

5.欄目訂閱:

點擊欄目名稱后或者欄目列表標題欄上的“+”,即可訂閱該欄目,具體有什么作用,我還沒有察覺到

6.取消訂閱:

點擊欄目列表標題欄上的“—”即可取消訂閱該欄目。

五.消息欄

消息欄

1.評論回復:

真可惜目前還沒人回復我的評論。。。。

2.評論被贊:

如下圖

六.查看贊

查看贊

1.原文鏈接:

在頂部顯示原文標題,點擊可跳轉(zhuǎn)到原文

2.我的點評:

顯示你的頭像和id,以及評論的內(nèi)容,被贊的數(shù)量

3.點贊用戶:

下方顯示一排贊了此條評論的用戶的頭像

七.設(shè)置

如下圖


設(shè)置

有興趣的同學歡迎點擊下面關(guān)注,在后續(xù)的更新中會收到提醒噠~
[2]: http://zhstatic.zhihu.com/pkg/store/daily/zhihu-daily-zhihu-2.5.4%28392%29.apk

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內(nèi)容