文章目录
- butterknife插件使用
- 导入依赖
- 下载插件
- 使用
- 新闻详情页面显示
- 效果图
- 实现思路
- 具体实现
- 布局
- 数据库添加收藏表
- 新闻详情页面具体业务逻辑实现
- 详情页面跳转
- 效果图
- 具体实现步骤
butterknife插件使用
导入依赖
下载插件
使用
选中视图
选择点击事件
新闻详情页面显示
效果图
实现思路
- 用点击事件跳出窗口选择字体实现字体大小改变
- 收藏功能用数据库实现,点击收藏时将对应内容的数据存入数据库,取消收藏时将数据从数据库中删除,根据数据库中数据将列表显示在我的收藏中。
具体实现
布局
fragment_detail.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android" >
<RelativeLayout
android:background="#FF4444"
android:layout_width="match_parent"
android:layout_height="40dp">
<TextView
style="@style/text_detail"
android:text="详情"/>
<ImageView
android:id="@+id/iv_back_detail"
style="@style/image_back_detail"
android:src="@mipmap/back"/>
<LinearLayout
style="@style/ll_detail"
>
<ImageView
android:id="@+id/iv_textsize_detail"
style="@style/image_detail_bar"
android:src="@mipmap/text_size"/>
<ImageView
android:id="@+id/iv_shrae_detail"
style="@style/image_detail_bar"
android:src="@mipmap/share"/>
<ImageView
android:id="@+id/iv_collect_detail"
style="@style/image_detail_bar"
android:src="@mipmap/collect"/>
</LinearLayout>
</RelativeLayout>
<ProgressBar
android:id="@+id/progress_detail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="?android:attr/progressBarStyleHorizontal"
android:max="100"
android:progress="10"/>
<WebView
android:id="@+id/webview_detail"
style="@style/webview_detail"></WebView>
</LinearLayout>
style
<style name="text_detail">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_centerInParent">true</item>
<item name="android:textSize">20sp</item>
<item name="android:textColor">#ffffff</item>
</style>
<style name="image_back_detail">
<item name="android:layout_width">25dp</item>
<item name="android:layout_height">25dp</item>
<item name="android:layout_centerVertical">true</item>
</style>
<style name="ll_detail">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">match_parent</item>
<item name="android:layout_alignParentRight">true</item>
<item name="android:orientation">horizontal</item>
</style>
<style name="image_detail_bar">
<item name="android:layout_width">25dp</item>
<item name="android:layout_height">25dp</item>
<item name="android:layout_marginLeft">10dp</item>
<item name="android:layout_gravity">center_vertical</item>
</style>
<style name="webview_detail">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">0dp</item>
<item name="android:layout_weight">1</item>
<item name="android:background">#d7d41b</item>
</style>
数据库添加收藏表
添加收藏表
设置对象与表的关系
新闻详情页面具体业务逻辑实现
import android.annotation.SuppressLint;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.Toast;
import com.example.administrator.zhjrtt.R;
import com.j256.ormlite.dao.Dao;
import com.xzit.bean.NewListData;
import com.xzit.db.MyDbHelper;
import java.sql.SQLException;
import java.util.List;
import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;
import butterknife.Unbinder;
//1.布局
//2.加载布局
public class DetailFragment extends BaseFragment {
@BindView(R.id.iv_back_detail)
ImageView Back;
@BindView(R.id.iv_textsize_detail)
ImageView Textsize;
@BindView(R.id.iv_shrae_detail)
ImageView Shrae;
@BindView(R.id.iv_collect_detail)
ImageView Collect;
@BindView(R.id.progress_detail)
ProgressBar progress;
@BindView(R.id.webview_detail)
WebView webview;
Unbinder unbinder;
//创建Newsbean对象
private NewListData.DataBean.NewsBean bean;
public DetailFragment() {
}
@SuppressLint("ValidFragment")
public DetailFragment(NewListData.DataBean.NewsBean bean) {
this.bean = bean;
}
@Override
protected View getMyView() {
View view = View.inflate(getContext(), R.layout.fragment_detail, null);
//初始化数据库对象
initDao();
return view;
}
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
//3.加载网页数据
loadWebView();
}
private void loadWebView() {
//webView发请求加载网页数据
webview.loadUrl(HOST+bean.url);
//创建webviewclient禁止浏览器自动弹出
webview.setWebViewClient(new WebViewClient());
//获取加载进度
webview.setWebChromeClient(new MyWebChromeClient());
webview.getSettings().setJavaScriptEnabled(true);//设置js可用
}
//4:重写onProgressChanged的方法
class MyWebChromeClient extends WebChromeClient{
@Override
public void onProgressChanged(WebView view, int newProgress) {
System.out.println("进度"+newProgress);
if(newProgress != 100){
progress.setMax(100);
progress.setProgress(newProgress);
progress.setVisibility(View.VISIBLE);//显示
}else{
progress.setVisibility(View.INVISIBLE);//隐藏
}
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
// TODO: inflate a fragment view
View rootView = super.onCreateView(inflater, container, savedInstanceState);
unbinder = ButterKnife.bind(this, rootView);
return rootView;
}
@Override
public void onDestroyView() {
super.onDestroyView();
unbinder.unbind();
}
@OnClick({R.id.iv_back_detail, R.id.iv_textsize_detail, R.id.iv_shrae_detail, R.id.iv_collect_detail})
public void onViewClicked(View view) {
switch (view.getId()) {
case R.id.iv_back_detail:
onClickBack();
break;
case R.id.iv_textsize_detail:
onFontClick();
break;
case R.id.iv_shrae_detail:
Toast.makeText(getContext(),"分享",Toast.LENGTH_SHORT).show();
break;
case R.id.iv_collect_detail:
onCollectClick();
break;
}
}
//创建列表数据库增删改查对象
private Dao<NewListData.DataBean.NewsBean,Integer> dao ;
public void initDao(){
MyDbHelper myDbHelper = new MyDbHelper(getContext());
try {
dao=myDbHelper.getDao(NewListData.DataBean.NewsBean.class);
} catch (SQLException e) {
e.printStackTrace();
}
}
@Override
public void onResume() {
super.onResume();
//查询当前新闻是否存在,如果存在 显示已收藏 否则显示未收藏
try {
NewListData.DataBean.NewsBean newsBean = dao.queryForId(bean.id);
if (newsBean == null){
isCollected=false;
Collect.setImageResource(R.mipmap.collect);
}else {
isCollected = true;
Collect.setImageResource(R.mipmap.collected);
}
} catch (SQLException e) {
e.printStackTrace();
}
}
//收藏
private boolean isCollected = false;
private void onCollectClick() {
if (isCollected){
isCollected = false;
Collect.setImageResource(R.mipmap.collect);
try {
//取消收藏时将数据从数据库删除
dao.deleteById(bean.id);
} catch (SQLException e) {
e.printStackTrace();
}
Toast.makeText(getContext(),"取消收藏",Toast.LENGTH_SHORT).show();
}else {
isCollected = true;
Collect.setImageResource(R.mipmap.collected);
try {
//收藏时将数据保存到数据库
dao.create(bean);
} catch (SQLException e) {
e.printStackTrace();
}
Toast.makeText(getContext(),"收藏成功",Toast.LENGTH_SHORT).show();
}
try {
List<NewListData.DataBean.NewsBean> list = dao.queryForAll();
System.out.println("数据"+list.toString());
System.out.println("遍历结束");
} catch (SQLException e) {
e.printStackTrace();
}
}
//5.字体大小改变事件
private String[] levels={"小","中","大","超大"};
private int choiceItem = 0;
private void onFontClick() {
//创建对话框
AlertDialog.Builder builder =new AlertDialog.Builder(getContext());
builder.setTitle("设置字体大小");
builder.setSingleChoiceItems(levels, choiceItem, new DialogInterface.OnClickListener() {
//单选 参1 选项数组 参2,默认选中 参3,处理事件
@Override
public void onClick(DialogInterface dialog, int which) {
choiceItem = which;
}
});
builder.setPositiveButton("确认", new DialogInterface.OnClickListener() {
//确认 参1 按钮文字 参2事件
@Override
public void onClick(DialogInterface dialog, int which) {
switch (choiceItem){
case 0:
webview.getSettings().setTextSize(WebSettings.TextSize.SMALLER);
break;
case 1:
webview.getSettings().setTextSize(WebSettings.TextSize.NORMAL);
break;
case 2:
webview.getSettings().setTextSize(WebSettings.TextSize.LARGER);
break;
case 3:
webview.getSettings().setTextSize(WebSettings.TextSize.LARGEST);
break;
}
dialog.dismiss();
}
});
builder.setNegativeButton("取消", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
dialog.dismiss();
}
});
builder.create().show();
}
//返回事件
private void onClickBack() {
getActivity().finish();
}
}
详情页面跳转
效果图
具体实现步骤
在列表点击事件中添加跳转方法
将bean的值传到新闻详情页面DetailActivity
注意:页面传值时需要将数据序列化
编写DetailFragment的带参构造方法,传入bean
修改webview页面地址