实现网易新闻框架的搭建

使用drawerlayout,viewpager,tablelayout,fragment来实现网易新闻框架的搭建

一:首先我们来完成activity_main的布局:

注意:我们整个布局的大布局应该设置为drawerlayout



    

    

    


完成布局我们在activity中完成逻辑代码
package com.example.dell.wangyishall;

import android.os.Bundle;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBar;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.view.MenuItem;

public class MainActivity extends AppCompatActivity {

    private DrawerLayout drawer_layout;
    private ActionBarDrawerToggle toggle;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initView();
        init_actionBar_Draw();

    }

    //初始化控件drawerlayout实现侧拉
    private void initView() {
        drawer_layout = (DrawerLayout) findViewById(R.id.activity_main);
    }

    /**
     * 初始化ActionBar 和 DrawerLayout
     */
    private void init_actionBar_Draw() {
        //得到actionbar对象
        ActionBar actionBar = getSupportActionBar();
        //决定左上角的图标是否可以点击
        actionBar.setDisplayHomeAsUpEnabled(true);
        actionBar.setHomeButtonEnabled(true);

        //改变android.R.id.home返回图标。
        //Drawer拉出、隐藏,带有android.R.id.home动画效果。
        // 监听Drawer拉出、隐藏;
        toggle = new ActionBarDrawerToggle(this, drawer_layout, R.string.app_name, R.string.app_name);
        //将抽屉指示器的状态与链接的DrawerLayout同步其状态
        toggle.syncState();
        // ActionBar关联DrawerLayout
        drawer_layout.addDrawerListener(toggle);
    }

    //在点击选项菜单(OptionsMenu:点击menu弹出的菜单)的菜单项时
    // 即调用了onMenuItemSelected 也调用了onOptionsItemSelected


    @Override
    public boolean onOptionsItemSelected(MenuItem item) {

        if (drawer_layout.isDrawerOpen(GravityCompat.END)) {
            drawer_layout.closeDrawer(GravityCompat.END);//关闭抽屉
            return super.onOptionsItemSelected(item);
        }
        return toggle.onOptionsItemSelected(item) | super.onOptionsItemSelected(item);
    }
}


完成第一个activity布局之后,因为我们在里面设置了这个左侧了fragment,所以接下来就是完成左侧fragment

里面添加的fragment
那么第一个就是我们的右侧啦,因为在这个小demo里没有填充右侧拉里面的功能或是数据
package com.example.dell.wangyishall;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class RightFragment extends Fragment {


    public RightFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_right, container, false);
    }

}

那么我们现在来实现左侧拉的fragment:那么首先还是我们先完成他的布局:





    
   



接下来就是左侧拉里面的逻辑代码:在这里面的呢我们一个在左侧拉的fragment里添加了五个点击事件,并且用的
listview来添加;


package com.example.dell.wangyishall;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ListView;

import java.util.ArrayList;
import java.util.List;


/**
 * A simple {@link Fragment} subclass.
 */
public class LeftFragment extends Fragment {


    private MainFragment main_fragment;
    private SecondFragment second_fragment;
    private ThirdFragment three_fragment;
    private fourthFragment four_fragment;
    private FifthFragment five_fragment;

    public LeftFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View inflate = inflater.inflate(R.layout.fragment_left, container, false);

        ListView list_view = inflate.findViewById(R.id.listview);

        List list_str = new ArrayList<>();
        for (int i = 1; i < 6; i++) {
            list_str.add("第"+i+"个Fragment");
        }
        list_view.setAdapter(new MyBaseAdapter(getActivity(),list_str));
        main_fragment = new MainFragment();
        second_fragment = new SecondFragment();
        three_fragment = new ThirdFragment();
        four_fragment = new fourthFragment();
        five_fragment = new FifthFragment();

        getActivity().getSupportFragmentManager().beginTransaction().add(R.id.linear, main_fragment).commit();
        getActivity().getSupportFragmentManager().beginTransaction().add(R.id.linear, second_fragment).commit();
        getActivity().getSupportFragmentManager().beginTransaction().add(R.id.linear, three_fragment).commit();
        getActivity().getSupportFragmentManager().beginTransaction().add(R.id.linear, four_fragment).commit();
        getActivity().getSupportFragmentManager().beginTransaction().add(R.id.linear, five_fragment).commit();
        getActivity().getSupportFragmentManager().beginTransaction().hide(second_fragment).hide(three_fragment).hide(four_fragment).hide(five_fragment).commit();

      list_view.setOnItemClickListener(new AdapterView.OnItemClickListener() {
          @Override
          public void onItemClick(AdapterView adapterView, View view, int i, long l) {
              switch (i) {
                  case 0:
                      getActivity().getSupportFragmentManager().beginTransaction().show(main_fragment).hide(second_fragment).hide(three_fragment).hide(four_fragment).hide(five_fragment).commit();
                      break;
                  case 1:
                      getActivity().getSupportFragmentManager().beginTransaction().show(second_fragment).hide(main_fragment).hide(three_fragment).hide(four_fragment).hide(five_fragment).commit();
                      break;
                  case 2:
                      getActivity().getSupportFragmentManager().beginTransaction().show(three_fragment).hide(main_fragment).hide(second_fragment).hide(four_fragment).hide(five_fragment).commit();
                      break;
                  case 3:
                      getActivity().getSupportFragmentManager().beginTransaction().show(four_fragment).hide(main_fragment).hide(second_fragment).hide(three_fragment).hide(five_fragment).commit();
                      break;
                  case 4:
                      getActivity().getSupportFragmentManager().beginTransaction().show(five_fragment).hide(main_fragment).hide(second_fragment).hide(three_fragment).hide(four_fragment).commit();
                      break;
                  default:
                      break;
              }
          }
      });

        return inflate;
    }

上面也说到了我们用了这个listview,和fragment,那么接下来我们就是给他优化一下

package com.example.dell.wangyishall;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

import java.util.List;

/**
 * Created by DELL on 2017/8/31.
 */
public class MyBaseAdapter extends BaseAdapter {
    public Context context;
    public List list;

    public MyBaseAdapter(Context context, List list) {
        this.context = context;
        this.list = list;
    }

    @Override
    public int getCount() {
        return list.size();
    }

    @Override
    public Object getItem(int i) {
        return null;
    }

    @Override
    public long getItemId(int i) {
        return 0;
    }

    @Override
    public View getView(int i, View view, ViewGroup viewGroup) {
        View inflate = View.inflate(context, R.layout.item, null);
        TextView text = inflate.findViewById(R.id.tv_item);
        text.setText(list.get(i));
        return inflate;
    }
}


在这我们实现fragment_main的布局文件


<HorizontalScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">android.support.design.widget.TabLayout>
HorizontalScrollView>
<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent">android.support.v4.view.ViewPager>

那么实现完左侧拉里面的fragment之后呢,我们紧接着就去实现左侧拉里面的第一个fragment,因为左侧拉里面的第
一个fragment是我们实现加载数据的页面:


package com.example.dell.wangyishall;


import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import java.util.ArrayList;
import java.util.List;


/**
 * A simple {@link Fragment} subclass.
 */
public class MainFragment extends Fragment {


    private View inflate;
    private TabLayout tab_layout;
    private ViewPager pager;

   List list_str = new ArrayList<>();


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        inflate = inflater.inflate(R.layout.fragment_main, container, false);
        for (int i = 0; i < 10; i++) {
            list_str.add("No."+i);
        }
        initView();
        init_tab_pager();

        return inflate;
    }
    private void initView() {
        tab_layout = (TabLayout) inflate.findViewById(R.id.tab_layout);
        pager = (ViewPager) inflate.findViewById(R.id.pager);
    }
    private void init_tab_pager() {
        List list_fragment = new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            PagerFragment fragment = new PagerFragment();
            list_fragment.add(fragment);
        }

        tab_layout.setTabMode(TabLayout.MODE_FIXED);

        for (int i = 0; i < 10; i++) {
            tab_layout.addTab(tab_layout.newTab().setText(list_str.get(i)));
        }

        MyPagerAdapter adapter = new MyPagerAdapter(getActivity().getSupportFragmentManager(),list_str,list_fragment);
        pager.setOffscreenPageLimit(1);
        pager.setAdapter(adapter);
        tab_layout.setupWithViewPager(pager);
    }

接着创建fragment的适配器:


package com.example.dell.wangyishall;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**
 * Created by DELL on 2017/8/31.
 */

public class MyPagerAdapter extends FragmentPagerAdapter {
    public List list_str;
    public  List list_frag;

    //接收传过来的值
    public MyPagerAdapter(FragmentManager fm, List list_str, List list_frag) {
        super(fm);
        this.list_str = list_str;
        this.list_frag = list_frag;
    }
    //返回对应位置的Fragment
    @Override
    public Fragment getItem(int position) {
        return list_frag.get(position);
    }


    @Override
    public int getCount() {
        return list_frag.size();
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return list_str.get(position%list_str.size());
    }
}

那么我们的pagerfragment就是我们加载数据所需要的页面:


package com.example.dell.wangyishall;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class PagerFragment extends Fragment {


    public PagerFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        
        
        //我们在这里面进行添加数据的操作
        return inflater.inflate(R.layout.fragment_pager, container, false);
    }

}

最后来展示一下我们实现的效果:
















你可能感兴趣的:(实现网易新闻框架的搭建)