首先要导包,一个Xutils包一个TabLayout包
compile 'org.xutils:xutils:3.5.0' compile 'com.android.support:design:26.0.0-alpha1'Manieat里面一共两处,加权限以及关联
android:name=".App" 权限自己添加
然后是布局文件
Activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="test.com.week1.MainActivity"> <android.support.design.widget.TabLayout android:id="@+id/tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabIndicatorHeight="1dp" app:tabIndicatorColor="@color/colorAccent" app:tabSelectedTextColor="@color/colorPrimary" app:tabTextColor="#2de630" app:tabMode="scrollable" /> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_marginTop="3dp" android:layout_height="match_parent"/> </LinearLayout>my_fragment.xml (因为方法不同,这里就写了一个fragment布局,可以重复利用)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:orientation="vertical" android:layout_height="match_parent"> <ListView android:id="@+id/lv" android:layout_width="match_parent" android:layout_height="match_parent"/> </LinearLayout>
item.xml (这个是fragment里面的item项的布局)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <TextView android:id="@+id/name" android:layout_width="match_parent" android:layout_height="wrap_content"/> <ImageView android:id="@+id/image" android:layout_width="200dp" android:layout_height="160dp"/> </LinearLayout>
App类 也就是实例化Xutils
public class App extends Application{ @Override public void onCreate() { super.onCreate(); x.Ext.init(this); x.Ext.setDebug(BuildConfig.DEBUG); } }
还有两个封装类就不往这里写了,一个是TabLayout标题的封装类,因为标题是从网络上获取的所以要封装起来,另一个是fragment内容的封装类
两个类必须要封装好 我这里标题类名字为DataTab,内容类为Data,下面会用到,看的同时不要混淆
MainActivity 主要用于TabLayout标题以及跟ViewPage的联动
package test.com.week1; import android.os.Bundle; import android.support.design.widget.TabLayout; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentPagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import com.google.gson.Gson; import org.xutils.common.Callback; import org.xutils.http.RequestParams; import org.xutils.view.annotation.ContentView; import org.xutils.view.annotation.ViewInject; import org.xutils.x; import java.util.List; @ContentView(R.layout.activity_main) public class MainActivity extends AppCompatActivity { @ViewInject(R.id.tablayout) private TabLayout tabLayout; @ViewInject(R.id.viewpager) private ViewPager viewPager; private Gson gson; private List<DataTab.TngouBean> listTabs; private MyFragment[] fragments; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); x.view().inject(this); gson = new Gson(); loadData(); } private void loadData() { RequestParams params = new RequestParams("http://www.tngou.net/api/top/classify"); x.http().get(params, new Callback.CommonCallback<String>() { @Override public void onSuccess(String result) { DataTab tab = gson.fromJson(result,DataTab.class); listTabs = tab.getTngou(); initTab(); } @Override public void onError(Throwable ex, boolean isOnCallback) { } @Override public void onCancelled(CancelledException cex) { } @Override public void onFinished() { } }); } private void initTab() { for(DataTab.TngouBean bean:listTabs){ tabLayout.addTab(tabLayout.newTab().setText(bean.getName())); } fragments = new MyFragment[listTabs.size()]; viewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) { @Override public Fragment getItem(int position) { if(fragments[position] == null){ MyFragment my = MyFragment.getInstance(listTabs.get(position).getId()); fragments[position] = my; } return fragments[position]; } @Override public int getCount() { return listTabs.size(); } @Override public CharSequence getPageTitle(int position) { return listTabs.get(position).getName(); } }); tabLayout.setupWithViewPager(viewPager); } }
MyFragment 用于fragment内容的展示 这里展示时用的listview 适配器写成了内部类,在最下面
package test.com.week1; import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.ImageView; import android.widget.ListView; import android.widget.TextView; import com.google.gson.Gson; import org.xutils.common.Callback; import org.xutils.http.RequestParams; import org.xutils.view.annotation.ContentView; import org.xutils.view.annotation.ViewInject; import org.xutils.x; import java.util.ArrayList; import java.util.List; @ContentView(R.layout.my_fragment) public class MyFragment extends Fragment{ @ViewInject(R.id.lv) private ListView lv; private int id; private List<Data.TngouBean> list = new ArrayList<>(); private MyAdapter adapter; public static MyFragment getInstance(int id) { MyFragment myFragment = new MyFragment(); Bundle bundle = new Bundle(); bundle.putInt("id",id); myFragment.setArguments(bundle); return myFragment; } @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view = x.view().inject(this,inflater,container); id = getArguments().getInt("id"); adapter = new MyAdapter(); lv.setAdapter(adapter); loadData(); return view; } private void loadData() { RequestParams requestParams=new RequestParams("http://www.tngou.net/api/top/list"); requestParams.addQueryStringParameter("page","1"); requestParams.addQueryStringParameter("rows","10"); requestParams.addQueryStringParameter("id",id+""); x.http().get(requestParams, new Callback.CommonCallback<String>() { @Override public void onSuccess(String result) { Data data=new Gson().fromJson(result,Data.class); list.addAll(data.getTngou()); adapter.notifyDataSetChanged(); } @Override public void onError(Throwable ex, boolean isOnCallback) { } @Override public void onCancelled(CancelledException cex) { } @Override public void onFinished() { } }); } class MyAdapter extends BaseAdapter{ @Override public int getCount() { return list.size(); } @Override public Object getItem(int position) { return null; } @Override public long getItemId(int position) { return 0; } @Override public View getView(int position, View convertView, ViewGroup parent) { ViewHolder holder = null; if(convertView == null) { holder = new ViewHolder(); convertView = View.inflate(getContext(),R.layout.item,null); x.view().inject(holder,convertView); convertView.setTag(holder); }else{ holder = (ViewHolder)convertView.getTag(); } Data.TngouBean bean = list.get(position); holder.name.setText(bean.getTitle()); x.image().bind(holder.image,"http://tnfs.tngou.net/image"+bean.getImg()); return convertView; } } class ViewHolder{ @ViewInject(R.id.name) TextView name; @ViewInject(R.id.image) ImageView image; } }
效果图