WanAndroid實戰——內容顯示
摘要：
前情回顧：
1.WanAndroid實戰——首頁Banner
2.WanAndroid實戰——首頁文章
目前已經能夠展示首頁文章和banner圖了，但是卻無法顯示文章的內容，就像給了一個美味的蛋糕，卻不讓你吃，現在，我們就來吃蛋糕（再不吃就過保質期了）。
...
前情回顧：
目前已經能夠展示首頁文章和banner圖了，但是卻無法顯示文章的內容，就像給了一個美味的蛋糕，卻不讓你吃，現在，我們就來吃蛋糕（再不吃就過保質期了）。
顯示文章內容.gif
內容展示Activity
既然要展示內容，而這些內容都是通過網頁來顯示的，這裡選擇使用開源框架 AgentWeb 。
1.在build.gradle裡新增依賴。
implementation 'com.just.agentweb:agentweb:4.0.2' implementation 'com.just.agentweb:download:4.0.2'
2.建立用來展示內容的 WebViewActivity.java ，這裡選擇繼承自 AppCompatActivity 而不是 BaseActivity ，建立完成後會自動生成對應的佈局檔案。
3.修改佈局檔案，這裡直接給出佈局檔案程式碼。
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".view.WebViewActivity"> <android.support.v7.widget.Toolbar android:id="@+id/toolBar" style="@style/ToolBarStyle" android:layout_width="match_parent" android:layout_height="wrap_content" app:layout_constraintBottom_toTopOf="@id/web_content" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" > <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:ellipsize="marquee" android:focusable="true" android:focusableInTouchMode="true" android:marqueeRepeatLimit="-1" android:singleLine="true" android:textColor="@color/white" android:textSize="@dimen/actionbar_title_size" tools:text="@string/app_name" /> </android.support.v7.widget.Toolbar> <LinearLayout android:id="@+id/web_content" android:layout_width="match_parent" android:layout_height="0dp" android:orientation="vertical" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@id/toolBar" /> </android.support.constraint.ConstraintLayout>
這裡的toolBar的title我加了一個跑馬燈的效果，如果覺得low，或者不希望無限迴圈，可以自己修改裡面的屬性值。新增的原因是為了展示全內容，並且不希望換行顯示。這個佈局檔案整體來說還是很簡單的。
4.完善 WebViewActivity.java 。
從效果來看，需要有一個返回按鈕，一個載入進度條，一個內容展示的介面，因為使用 AgentWeb ，只需要關心返回按鈕的新增即可。
package com.tom.wanandroid.view;
import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.widget.LinearLayout;
import android.widget.TextView;
import com.just.agentweb.AgentWeb;
import com.tom.wanandroid.Constant;
import com.tom.wanandroid.R;
import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.Unbinder;
/**
* <p>Title: MainModel</p>
* <p>Description: 內容展示介面</p>
*
* @author tom
* @date 2019/3/29 10:54
**/
public class WebViewActivity extends AppCompatActivity {
Unbinder mBinder;
@BindView(R.id.web_content)
LinearLayout mWebContent;
protected AgentWeb mAgentWeb;
@BindView(R.id.title)
TextView mTitle;
@BindView(R.id.toolBar)
Toolbar mToolBar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view);
mBinder = ButterKnife.bind(this);
Intent intent = getIntent();
String title = intent.getStringExtra(Constant.ARTICLE_TITLE);
String url = intent.getStringExtra(Constant.ARTICLE_URL);
setUpActionBar(title);
mAgentWeb = AgentWeb.with(this)
.setAgentWebParent(mWebContent, new LinearLayout.LayoutParams(-1, -1))
.useDefaultIndicator()
.createAgentWeb()
.ready()
.go(url);
}
/**
* <p>設定actionbar的title</p>
*
* @param title title
*/
private void setUpActionBar(String title) {
setSupportActionBar(mToolBar);
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
actionBar.setHomeAsUpIndicator(R.drawable.back_selector);
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
mTitle.setText(title);
}
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == android.R.id.home) {
finish();
}
return super.onOptionsItemSelected(item);
}
@Override
protected void onPause() {
mAgentWeb.getWebLifeCycle().onPause();
super.onPause();
}
@Override
protected void onResume() {
mAgentWeb.getWebLifeCycle().onResume();
super.onResume();
}
@Override
protected void onDestroy() {
mAgentWeb.getWebLifeCycle().onDestroy();
super.onDestroy();
mBinder.unbind();
}
}
AgentWeb 的使用可以檢視作者的github-- AgentWeb
顯示的容器已經準備完畢，接下來就是來給Banner和recycleView新增點選事件了。
新增點選事件
1.給Banner新增點選事件
mMainBanner.setOnBannerListener(),詳細的可以看 Android圖片輪播控制元件
2.recycleView新增點選事件
給recycleView新增點選事件的方法有很多，我這裡使用介面的方式。在 ArticleAdapter.java 中定義
private OnItemClickListener mListener;
public void setListener(OnItemClickListener listener) {
mListener = listener;
}
public interface OnItemClickListener {
/**
* <p>文章點選事件</p>
* @param view view
* @param position 點選位置
*/
void onItemClick(View view, int position);
/**
* <p>收藏點選事件</p>
* @param view 點選的view
* @param position 點選的位置
*/
void onCollectionClick(View view, int position);
}
在 onBindViewHolder 方法中，給itemView和mArticleCollection新增點選事件。
//item點選事件
articleHolder.itemView.setOnClickListener(v -> {
if (mListener != null) {
mListener.onItemClick(articleHolder.itemView,articleHolder.getLayoutPosition());
}
});
//收藏的點選事件
articleHolder.mArticleCollection.setOnClickListener(v ->{
if (mListener != null) {
mListener.onCollectionClick(articleHolder.mArticleCollection,articleHolder.getLayoutPosition());
}
});
具體的處理，就可以在MainActivity中進行實現了。
@Override
public void onItemClick(View view, int position) {
if (mArticleDatas != null) {
ArticleBean bean = mArticleDatas.get(position);
Utils.startWebView(this, bean.title, bean.link);
}
}
@Override
public void onCollectionClick(View view, int position) {
ToastUtils.setBgColor(getResources().getColor(R.color.colorPrimaryDark, null));
ToastUtils.setMsgColor(getResources().getColor(R.color.white, null));
ToastUtils.showShort(R.string.coming_soon);
}
跳轉的工具類
package com.tom.wanandroid.utils;
import android.content.Context;
import android.content.Intent;
import com.tom.wanandroid.Constant;
import com.tom.wanandroid.view.WebViewActivity;
/**
* <p>Title: Utils</p>
* <p>Description: 工具集合</p>
*
* @author tom
* @date 2019/3/26 14:40
**/
public class Utils {
/**
* <p>跳轉到WebView</p>
* @param context 上下文
* @param title title
* @param url url
*/
public static void startWebView(Context context, String title, String url) {
Intent intent = new Intent();
intent.setClass(context, WebViewActivity.class);
intent.putExtra(Constant.ARTICLE_TITLE, title);
intent.putExtra(Constant.ARTICLE_URL, url);
context.startActivity(intent);
}
}
完成以上內容，就可以吃蛋糕了。