1. 程式人生 > >TabLayout +ViewPager + Fragment : RecyclerView展示網路資料 + webView 顯示網頁

TabLayout +ViewPager + Fragment : RecyclerView展示網路資料 + webView 顯示網頁

題目要求:

1,   (25)    使用TabLayout實現頁面的導航切換

2,   (25)    實現ViewPager + Fragment ,切換頁面, 2Fragment;

3,   (25)    第一個Fragment,  獲取網路資料,展示到RecyclerView

地址:  http://app.vmoiver.com/apiv3/post/getPostInCate?cateid=0&p=1

解析欄位:  title ,  image

4,   (25)    第二個Fragment, 通過webView展示http://baidu.com網頁資訊

效果圖

    


程式碼例項:

匯入jar包

xUtils  和  gson 的jar包

新增依賴:

compile 'com.android.support:design:26.0.0-alpha1'
compile 'com.android.support:recyclerview-v7:25.3.1'

一, 頁面:

main_activity.html

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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" android:orientation="vertical" tools:context="bw.com.day18_test.MainActivity"> <android.support.design.widget.TabLayout android:layout_width=
"match_parent" android:layout_height="60dp" android:id="@+id/tb_id" /> <android.support.v4.view.ViewPager android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/vp_id" /> </LinearLayout>
fragment_my_fragment01.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="bw.com.day18_test.MyFragment01">
    <android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/rv_id"/>
</FrameLayout>
fragment_my_fragment02.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="bw.com.day18_test.MyFragment02">
    <WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/web_view_id"/>
</FrameLayout>

二, 程式碼

MyApp.java

public class MyApp extends Application {
    @Override
public void onCreate() {
        super.onCreate();
//初始化xUtils
x.Ext.init(this);
x.Ext.setDebug(true);
}
}

注意:  必須要在清單檔案中, <application  adnroid:name = "  引入你自定義的Application 的子類"/ >

新增許可權 :    網路許可權,   讀寫SD卡的許可權

MainActivity.java

public class MainActivity extends AppCompatActivity {
    //導航
private TabLayout mTb;
    private List<String> titles;
//內容
private ViewPager mVp;
    private List<Fragment> data;
    private MyAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
//構建標題
titles = new ArrayList<>();
titles.add("第一頁");
titles.add("第二頁");
//構建資料來源
data = new ArrayList<>();
data.add(new MyFragment01());
data.add(new MyFragment02());
//構建介面卡
adapter = new MyAdapter(getSupportFragmentManager());
mVp.setAdapter(adapter);
//將tabLayout 和ViewPager 繫結到一起
mTb.setupWithViewPager(mVp);
}
    private void initView() {
        mTb = (TabLayout) findViewById(R.id.tb_id);
mVp = (ViewPager) findViewById(R.id.vp_id);
}
    //TODO 自定義ViewPager 的介面卡
class MyAdapter extends FragmentPagerAdapter
    {
        public MyAdapter(FragmentManager fm) {
            super(fm);
}
        @Override
public Fragment getItem(int position) {
            return data.get(position);
}
        @Override
public int getCount() {
            return data.size();
}
        @Override
public CharSequence getPageTitle(int position) {
            return titles.get(position);
}
    }
}

MyFragment01.java

/**
 *  網路資料請求,解析 --- RecyclerView
 */
public class MyFragment01 extends Fragment {

    private RecyclerView mRv;//控制元件
private List<VMoive.DataBean> dataBean;
    private MyRecycleViewAdapter adapter;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
       View  view = inflater.inflate(R.layout.fragment_my_fragment01, container, false);
mRv = (RecyclerView) view.findViewById(R.id.rv_id);
//設定RecycleView顯示的佈局
LinearLayoutManager manager = new LinearLayoutManager(getContext(),LinearLayoutManager.VERTICAL,false);
mRv.setLayoutManager(manager);
//TODO 通過xUtils 獲取資料
RequestParams params = new RequestParams("http://app.vmoiver.com/apiv3/post/getPostInCate?cateid=0&p=1");
x.http().get(params, new Callback.CommonCallback<String>() {
            @Override
public void onSuccess(String result) {
                //TODO 得到資料來源
VMoive vMoive = new Gson().fromJson(result,VMoive.class);
dataBean = vMoive.getData();
//TODO 初始化介面卡
adapter = new MyRecycleViewAdapter(getContext(),dataBean);
mRv.setAdapter(adapter);
}

            @Override
public void onError(Throwable throwable, boolean b) {}

            @Override
public void onCancelled(CancelledException e) {}

            @Override
public void onFinished() { }
        });
        return view;
}
}

MyFragment02.java

public class MyFragment02 extends Fragment {

    private WebView mVb;
    private String url = "http://baidu.com";
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragment_my_fragment02, container, false);
mVb = (WebView) view.findViewById(R.id.web_view_id);
//TODO 載入地址
mVb.loadUrl(url);
//TODO 設定在當前App中顯示
mVb.setWebViewClient(new WebViewClient(){
            @Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
                //系統預設會開啟系統瀏覽器去開啟網頁,為了要顯示在自己的webview中必須設定這個屬性
view.loadUrl(url);
                return super.shouldOverrideUrlLoading(view, request);
}
        });
//TODO 設定支援js
WebSettings webSettings = mVb.getSettings();
webSettings.setJavaScriptEnabled(true);
        return view;
}
}

MyRecycleViewAdapter.java

public class MyRecycleViewAdapter extends RecyclerView.Adapter<MyRecycleViewAdapter.ViewHolder> {

    private Context context;
    private List<VMoive.DataBean> data;
    public MyRecycleViewAdapter(Context context, List<VMoive.DataBean> data)
    {
        this.context = context;
        this.data = data;
}
    @Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //TODO 繫結頁面
View view = LayoutInflater.from(context).inflate(R.layout.rv_item,parent,false);
ViewHolder viewHolder = new ViewHolder(view);
        return viewHolder;
}

    @Override
public void onBindViewHolder(ViewHolder holder, int position) {

        //賦值
holder.tv.setText(data.get(position).getTitle());
ImageOptions options = new ImageOptions.Builder()
                .setUseMemCache(true)
                .setFailureDrawableId(R.mipmap.ic_launcher)
                .setLoadingDrawableId(R.mipmap.ic_launcher)
                .build();
x.image().bind(holder.iv,data.get(position).getImage(),options);
}

    @Override
public int getItemCount() {
        return data.size();
}

    class ViewHolder extends RecyclerView.ViewHolder
    {
        ImageView iv;
TextView tv;
        public ViewHolder(View itemView) {
            super(itemView);
            this.iv = (ImageView) itemView.findViewById(R.id.iv_id);
            this.tv = (TextView) itemView.findViewById(R.id.tv_id);
}
    }
}
VMovie.java  -- gsonFormat 生成的實體類