使用ListView、ViewPager、scrollView编写今日头条界面

最新推荐文章于 2021-03-28 11:30:04 发布

JokerLoveAllen

最新推荐文章于 2021-03-28 11:30:04 发布

阅读量1.6k

点赞数 2

分类专栏： Android 文章标签： android 界面今日头条 viewpager listview

本文链接：https://blog.csdn.net/qq_34122768/article/details/52122348

版权

本文介绍如何利用Android的ListView、ViewPager和scrollView组件来创建今日头条的界面。首先，上方是红色背景框，内含图片和文字；接着是一个在scrollView中的RadioGroup。主要内容区域使用ListView模拟，通过ViewPager实现点击按钮切换不同内容，支持左右滑动。

摘要由CSDN通过智能技术生成

使用Android中ListView、ViewPager、scrollView控件编写今日头条界面

在编写代码的时候，我们应该有一个具体的思路。首先，今日头条上方是一个红色背景框，里面有两个小图片和今日头条的文本三个小控件，在背景框下方有一个可以拖动的按钮组成的控件，我们可以使用RadioGroup添加到scrollView滑动组件里。其次，今日头条的主文本区内是类似ListView的列表框，并且在点击按钮时可以更换主文本区内的内容，这时可以用ViewPager实现每一个按钮下的主文本区的显示，并且可以左右滑动。因此，将ListView控件添加到ViewPager里面，就可以达到预期目标。

我们首先看一个今日头条的主界面：

代码部分：

1.主程序：(需要注意的是本代码使用的ListView是通过布局得到的，并且ListView布局里只包含一个ListView组件)

<pre name="code" class="java">import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import com.jokerloveallen.topnews.adapter.MyListMultAdapter;
import com.jokerloveallen.topnews.adapter.MyViewPagerAdapter;
import com.jokerloveallen.topnews.entity.News;

import java.util.ArrayList;
import java.util.List;
// 本项目是将ListView 放在viewPager里面实现翻页需关联ListView适配器,和ViewPager的扩展适配器。
public class MainActivity extends AppCompatActivity {
    private RadioGroup radioGroup;
    private HorizontalScrollView scrollView;
    private ViewPager vp;
    private List<ListView> myData;//存放ListView的集合
    private String[] channel;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        this.requestWindowFeature(Window.FEATURE_NO_TITLE);
        //全屏
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);
        //隐藏Action_Bar