MVP框架解析資料瀑布流展示列表
阿新 • • 發佈:2019-01-13
1.先把MVP框架搭建一下
2.分一下包 分成三個 ui包,di包,data包
3.在這ui包中在分三個包,分別是: activity包,fragent包,adapter包
4.在di包中在分三個包,分別是:presenter包,model包,contract包
5.contract包是個契約包,裡面是MVP所需要的介面,先把MVP需要的介面給寫一下吧
這就是MVP所需要的介面
import javax.security.auth.callback.Callback; public interface Logincontract { //V層 public interface Loginview { //回顯資料 public void shapeData(); } //P層 public interface Loginpresenter<Loginview> { //繫結服務 public void attachview(Logincontract.Loginview loginview); //解綁服務 public void detachview(Logincontract.Loginview loginview); //獲取資料 public void resquesData(); } //M層 public interface Loginmodel { //請求資料 public void cantainData(Callback callback); //介面回撥 public interface Callback { public void onCallback(); } } }
然後再presenter包中建立個presenter類繼承一下contract介面中的資料
import java.lang.ref.SoftReference; import gsp.com.day8.di.contract.Logincontract; import gsp.com.day8.di.model.Loginmode; public class Loginpresenter implements Logincontract.Loginpresenter { Logincontract.Loginview loginview; private SoftReference<Logincontract.Loginview> softReference; private Loginmode loginmode; @Override public void attachview(Logincontract.Loginview loginview) { this.loginview=loginview; //建立軟引用 softReference = new SoftReference<>(loginview); //建立M層 loginmode = new Loginmode(); } @Override public void detachview(Logincontract.Loginview loginview) { //解除繫結 softReference.clear(); } @Override public void resquesData() { loginmode.cantainData(new Logincontract.Loginmodel.Callback() { @Override public void onCallback() { loginview.shapeData(); } }); } }
然後再model包中建立個model類繼承一下contract介面中的資料
import gsp.com.day8.di.contract.Logincontract;
public class Loginmode implements Logincontract.Loginmodel {
@Override
public void cantainData(Callback callback) {
callback.onCallback();
}
}
MVP的框架差不多就搭建完了,現在開始解析資料並且用瀑布流展示資料,下面的圖片是要求做的功能點
下面開始寫一下點選按鈕切換頁面的佈局,我用的Fragment的方法寫的
<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=".ui.activity.LoginActivity">
<FrameLayout
android:id="@+id/fram"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"></FrameLayout>
<RadioGroup
android:id="@+id/group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<RadioButton
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="@null"
android:gravity="center"
android:text="首頁"
android:textSize="25dp" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="@null"
android:gravity="center"
android:text="|"
android:textSize="25dp" />
<RadioButton
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="@null"
android:gravity="center"
android:text="我的"
android:textSize="25dp" />
</RadioGroup>
</LinearLayout>
然後寫一下呼叫元件id並且實現效果 切記不要忘了建立Fragment的頁面
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.widget.FrameLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import butterknife.BindView;
import butterknife.ButterKnife;
import gsp.com.day8.R;
import gsp.com.day8.ui.fragment.Homeactivity;
import gsp.com.day8.ui.fragment.Myactivity;
public class LoginActivity extends FragmentActivity {
@BindView(R.id.fram)
FrameLayout fram;
@BindView(R.id.button1)
RadioButton button1;
@BindView(R.id.button2)
RadioButton button2;
@BindView(R.id.group)
RadioGroup group;
private FragmentManager manager;
private FragmentTransaction transaction;
private Homeactivity homeactivity;
private Myactivity myactivity;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
manager = getSupportFragmentManager();
transaction = manager.beginTransaction();
homeactivity = new Homeactivity();
myactivity = new Myactivity();
transaction.add(R.id.fram, homeactivity);
transaction.add(R.id.fram, myactivity);
transaction.show(homeactivity).hide(myactivity);
transaction.commit();
group.check(group.getChildAt(0).getId());
group.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
FragmentTransaction fragmentTransaction = manager.beginTransaction();
switch (checkedId){
case R.id.button1:
fragmentTransaction.show(homeactivity).hide(myactivity).commit();
break;
case R.id.button2:
fragmentTransaction.show(myactivity).hide(homeactivity).commit();
break;
}
}
});
}
}
寫完Fragment點選切換頁面後,我們寫一下用MVP框架解析資料並在列表展示資料
先寫契約介面,在契約接口裡面寫presenter介面,model介面
import gsp.com.day8.data.bean.Gridebean;
import gsp.com.day8.data.bean.Listbean;
public interface Homecontract {
//V層
public interface Homeview {
//回顯資料gride
public void shapeData(Gridebean resqonsData);
//回顯資料list
public void shapeData(Listbean resqonsData);
}
//P層
public interface Homepresenter<Loginview> {
//繫結服務
public void attachview(Homecontract.Homeview homeview);
//解綁服務
public void detachview(Homecontract.Homeview homeview);
//獲取資料
public void resquesData();
}
//M層
public interface Homemodel {
//請求資料
public void cantainData(Callback callback);
//介面回撥
public interface Callback {
void onCallback(Gridebean resqonsData);
void onCallback(Listbean resqonsData);
}
}
}
寫完契約介面後
然後在presenter包中建立個類並且繼承契約類裡面的presenter介面
import java.lang.ref.SoftReference;
import gsp.com.day8.data.bean.Gridebean;
import gsp.com.day8.data.bean.Listbean;
import gsp.com.day8.di.contract.Homecontract;
import gsp.com.day8.di.contract.Logincontract;
import gsp.com.day8.di.model.Homemode;
import gsp.com.day8.di.model.Loginmode;
public class Homepresenter implements Homecontract.Homepresenter<Homecontract.Homeview> {
Homecontract.Homeview homeview;
private SoftReference<Homecontract.Homeview> softReference;
private Homemode homemode;
@Override
public void attachview(Homecontract.Homeview homeview) {
//建立軟引用
softReference = new SoftReference<>(homeview);
this.homeview=homeview;
//建立M層
homemode = new Homemode();
}
@Override
public void detachview(Homecontract.Homeview homeview) {
softReference.clear();
}
@Override
public void resquesData() {
homemode.cantainData(new Homecontract.Homemodel.Callback() {
@Override
public void onCallback(Gridebean resqonsData) {
homeview.shapeData(resqonsData);
}
@Override
public void onCallback(Listbean resqonsData) {
homeview.shapeData(resqonsData);
}
});
}
}
然後在model包中建立個類並且繼承契約類裡面的model介面
在model類中進行Gson資料解析並且進行回傳資料
import com.google.gson.Gson;
import com.lzy.okgo.OkGo;
import com.lzy.okgo.callback.StringCallback;
import com.lzy.okgo.model.Response;
import gsp.com.day8.data.Contain;
import gsp.com.day8.data.bean.Gridebean;
import gsp.com.day8.data.bean.Listbean;
import gsp.com.day8.di.contract.Homecontract;
public class Homemode implements Homecontract.Homemodel {
@Override
public void cantainData(final Callback callback) {
OkGo.<String>get(Contain.GRIDEURL).execute(new StringCallback() {
@Override
public void onSuccess(Response<String> response) {
//響應資料
String responsedata = response.body().toString();
//解析資料
Gson gson = new Gson();
//
Gridebean gridebean = gson.fromJson(responsedata, Gridebean.class);
//響應玩資料回撥
callback.onCallback(gridebean);
}
});
OkGo.<String>get(Contain.LISTURL).execute(new StringCallback() {
@Override
public void onSuccess(Response<String> response) {
//響應資料
String responsedata = response.body().toString();
//解析資料
Gson gson = new Gson();
//
//Gridebean gridebean = gson.fromJson(responsedata, Gridebean.class);
Listbean listbean = gson.fromJson(responsedata, Listbean.class);
//響應玩資料回撥
callback.onCallback(listbean);
}
});
}
}
這是要展示頁面所需要的佈局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="10dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/sao" />
<android.support.v7.widget.SearchView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="8" />
<ImageView
android:layout_width="10dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/dan" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="20dp"
android:layout_weight="3" />
<android.support.v7.widget.RecyclerView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="20dp"
android:layout_weight="8"></android.support.v7.widget.RecyclerView>
</LinearLayout>
最後展示在相對應的Fragment的頁面上
關於Fragment的介面卡我給寫到了這個頁面的下面,如果需要,可以去看看
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import java.util.ArrayList;
import java.util.List;
import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.Unbinder;
import gsp.com.day8.R;
import gsp.com.day8.data.bean.Gridebean;
import gsp.com.day8.data.bean.Listbean;
import gsp.com.day8.di.contract.Homecontract;
import gsp.com.day8.di.presenter.Homepresenter;
import gsp.com.day8.ui.adapter.Grideadapter;
import gsp.com.day8.ui.adapter.Listadapter;
public class Homeactivity extends Fragment implements Homecontract.Homeview {
@BindView(R.id.recyclerview)
RecyclerView recyclerview;
Unbinder unbinder;
@BindView(R.id.listview)
RecyclerView listview;
private Homepresenter homepresenter;
private List<Gridebean.DataBean> data1;
private Grideadapter grideadapter;
private List<Listbean.DataBean> data2;
private Listadapter listadapter;
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = View.inflate(getActivity(), R.layout.home_layout, null);
unbinder = ButterKnife.bind(this, view);
//建立P層
homepresenter = new Homepresenter();
homepresenter.attachview(this);
//gride
recyclerview.setLayoutManager(new LinearLayoutManager(getActivity()));
//觸發
grideadapter = new Grideadapter(R.layout.gride, data1);
//給元件id
recyclerview.setAdapter(grideadapter);
homepresenter.resquesData();
//list
listview.setLayoutManager(new LinearLayoutManager(getActivity()));
//觸發
listadapter = new Listadapter(R.layout.list, data2);
//給元件id
listview.setAdapter(listadapter);
homepresenter.resquesData();
return view;
}
@Override
public void shapeData(Gridebean resqonsData) {
//記得轉下型吧list轉成Arraylist
//資料來源
data1 = resqonsData.getData();
grideadapter.notifyDataSetChanged();
ArrayList<Gridebean.DataBean> data = (ArrayList<Gridebean.DataBean>) resqonsData.getData();
//波浪型的佈局需要設定RecyclerView 其他型別的不需要設定了
StaggeredGridLayoutManager manager = new StaggeredGridLayoutManager(5, StaggeredGridLayoutManager.VERTICAL);
recyclerview.setLayoutManager(manager);
//設定介面卡
Grideadapter grideadapter = new Grideadapter(R.layout.gride, data);
recyclerview.setAdapter(grideadapter);
}
@Override
public void shapeData(Listbean resqonsData) {
//記得轉下型吧list轉成Arraylist
//資料來源
data2 = resqonsData.getData();
listadapter.notifyDataSetChanged();
ArrayList<Listbean.DataBean> data = (ArrayList<Listbean.DataBean>) resqonsData.getData();
//波浪型的佈局需要設定RecyclerView 其他型別的不需要設定了
StaggeredGridLayoutManager manager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
listview.setLayoutManager(manager);
//設定介面卡
Listadapter listadapter = new Listadapter(R.layout.list, data);
listview.setAdapter(listadapter);
}
@Override
public void onDestroyView() {
super.onDestroyView();
unbinder.unbind();
}
}
這個頁面寫解析的介面卡,因為要展示二個列表資料所以我們得寫兩個介面卡
這個介面卡是展示頂部一行5個數據信息的介面卡
import android.support.annotation.Nullable;
import android.widget.ImageView;
import com.bumptech.glide.Glide;
import com.chad.library.adapter.base.BaseQuickAdapter;
import com.chad.library.adapter.base.BaseViewHolder;
import java.util.List;
import gsp.com.day8.R;
import gsp.com.day8.data.bean.Gridebean;
public class Grideadapter extends BaseQuickAdapter<Gridebean.DataBean, BaseViewHolder> {
public Grideadapter(int layoutResId, @Nullable List<Gridebean.DataBean> data) {
super(layoutResId, data);
}
@Override
protected void convert(BaseViewHolder helper, Gridebean.DataBean item) {
//獲取文字
helper.setText(R.id.gridetext, item.getName());
//獲取圖片 記得強轉一下helper.getView(R.id.image)
Glide.with(mContext).load(item.getIcon()).into((ImageView) helper.getView(R.id.grideimage));
}
}
這個介面卡是展示底部一行2個數據信息的介面卡
import android.support.annotation.Nullable;
import android.widget.ImageView;
import com.bumptech.glide.Glide;
import com.chad.library.adapter.base.BaseQuickAdapter;
import com.chad.library.adapter.base.BaseViewHolder;
import java.util.List;
import gsp.com.day8.R;
import gsp.com.day8.data.bean.Listbean;
public class Listadapter extends BaseQuickAdapter<Listbean.DataBean, BaseViewHolder> {
public Listadapter(int layoutResId, @Nullable List<Listbean.DataBean> data) {
super(layoutResId, data);
}
@Override
protected void convert(BaseViewHolder helper, Listbean.DataBean item) {
//獲取文字
helper.setText(R.id.listtext, item.getNews_title());
//獲取圖片 記得強轉一下helper.getView(R.id.image)
Glide.with(mContext).load(item.getPic_url()).into((ImageView) helper.getView(R.id.listimage));
}
}
最後這是我做出的效果圖,做的不好看大家多多體諒一下