4.1 碎片的实践-简易新闻客户端

最新推荐文章于 2025-05-03 20:44:45 发布

wangyaminhc

最新推荐文章于 2025-05-03 20:44:45 发布

阅读量194

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Android 文章标签： Android

本文链接：https://blog.youkuaiyun.com/wangyaminhc/article/details/79702870

Android 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一个基于RecyclerView实现的新闻应用程序，详细讲解了从新建新闻类、布局设计到使用Fragment和Activity进行内容展示的过程。该应用支持单页和双页模式，通过适配器实现了新闻列表的高效加载。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.由于新建新闻类会用到RecyclerView,因此首先在 app.build.gradle中添加依赖库

compile 'com.android.support:recyclerview-v7:26.1.0'

第一步新建新闻类

package com.example.wangyamin.fragmentbestpractice;

/**
 * Created by wangyamin on 2018/3/23.
 */

public class News {
    private String tittle;
    private String content;


    public String getTittle() {
        return tittle;
    }

    public void setTittle(String tittle) {
        this.tittle = tittle;
    }

    public String getContent() {
        return content;
    }

    public void setContent(String content) {
        this.content = content;
    }
}

第二步，新建新闻标题加内容的布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent">
    <LinearLayout
        android:id="@+id/visibility_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:visibility="invisible">

        <TextView
            android:id="@+id/news_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="10dp"
            android:textSize="20sp"/>
        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@android:color/black"/>
        <TextView
            android:id="@+id/news_content"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:padding="15dp"
            android:textSize="18sp"/>
    </LinearLayout>
    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:background="@android:color/black"/>

</RelativeLayout>

其中细线用<View>表示，颜色设置为黑色

第三步，新建新闻内容碎片 NewContentFragment 继承自Fragment

public class NewsContentFragment extends Fragment {
    private View view;
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        view = inflater.inflate( R.layout.news_content_frag, container, false );
        return view;
    }
    public void refresh( String newsTitle, String newsContent){
        View visibilityLayout = view.findViewById(R.id.visibility_layout);
        visibilityLayout.setVisibility( View.VISIBLE);
        TextView newsTitleText = (TextView)view.findViewById(R.id.news_title);
        TextView newsContentText = (TextView)view.findViewById(R.id.news_content);

        newsTitleText.setText( newsTitle);
        newsContentText.setText( newsContent);
    }
}

提供了 refresh（）方法，用于获取新闻和内容的值来展示到界面上

第五步，上面的新闻和内容都是在双页模式下使用的，要想在单页模式下使用需要新建一个活动

右击项目包，-new-Activity-Empty Activity 新建一个活动用于展示新闻的内容新建news_content.xml布局文件

<?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"
    tools:context="com.example.wangyamin.fragmentbestpractice.NewsContentActivity">
    <fragment
        android:id="@+id/news_content_fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.example.wangyamin.fragmentbestpractice.NewsContentFragment"/>

</LinearLayout>

发挥了代码的复用性，直接引入NewsContentFragment

第六步修改NewsContentActivity中的代码

public class NewsContentActivity extends AppCompatActivity {

    public static void actionStart(Context context, String newsTitle, String newsContent ){
        Intent intent = new Intent( context, NewsContentActivity.class);
        intent.putExtra("news_title", newsTitle);
        intent.putExtra("news_content",newsContent);
        context.startActivity( intent );
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_content);
        String newsTitle = getIntent().getStringExtra("news_title");
        String newsContent = getIntent().getStringExtra("news_content");
        NewsContentFragment newsContentFragment = (NewsContentFragment)getSupportFragmentManager().findFragmentById(R.id.news_content_fragment);
        newsContentFragment.refresh( newsTitle,newsContent);
    }
}

上面的actionStart可以方便的启动实例，并传入数据

通过Intent获取到了传入的新闻标题和内容，然后调用FragmentManager的findFragmentById的方法的到了NewsContentFragment的实例，接着调用refresh（）方法传入Tittle 和Content，刷新界面

第七步，创建显示新闻列表的布局news_title_frag.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/news_title_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"></android.support.v7.widget.RecyclerView>

</LinearLayout>

第八步，新建news_title_frag的子项布局 news_item.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="wrap_content"
    android:id="@+id/news_title"
    android:singleLine="true"
    android:ellipsize="end"
    android:textSize="18dp"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:paddingTop="15dp"
    android:paddingBottom="15dp">
</TextView>

其中padding是给控件周围补上空白， singleLine 表示单行显示， ellipsize表示显示超出控件宽度时，文本的缩略方式

第九步，创建用于展示新闻列表的碎片NewsTitleFragment

package com.example.wangyamin.fragmentbestpractice;

import android.os.Bundle;
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.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

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

/**
 * Created by wangyamin on 2018/3/23.
 */

public class NewsTitleFragment extends Fragment {
    private  boolean isTwoPane;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate( R.layout.news_title_frag,container,false);
        RecyclerView newsTitleRecyclerView = (RecyclerView) view.findViewById( R.id.news_title_recycler_view);
        LinearLayoutManager layoutManager = new LinearLayoutManager( getActivity() );
        newsTitleRecyclerView.setLayoutManager(layoutManager);
        NewsAdapter adapter = new NewsAdapter( getNews() );
        newsTitleRecyclerView.setAdapter(adapter);
        return view;
    }

    private List<News> getNews() {
        List<News> newsList =  new ArrayList<>();
        for( int i = 0; i<=50; i++ ){
            News news = new News();
            news.setTittle("This is news Title"+i );
            news.setContent( getRandomLengthContent("This is news Content"+i+"."));
            newsList.add(news);
        }
        return  newsList;
    }

    private String getRandomLengthContent(String content) {
        Random random = new Random();
        int length = random.nextInt(20)+1;
        StringBuilder builder = new StringBuilder();
        for( int i =0; i<length; i++ ){
            builder.append(content);
        }
        return builder.toString();
    }

    @Override
    public void onActivityCreated(@Nullable Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        if (getActivity().findViewById(R.id.news_content_layout) != null ){
            isTwoPane = true;
        }else {
            isTwoPane = false;
        }
    }
    class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.ViewHolder>{
        private List<News> mNewsList;
        class ViewHolder extends RecyclerView.ViewHolder {
            TextView newsTitleText;
            public ViewHolder(View itemView) {
                super(itemView);
                newsTitleText = (TextView) itemView.findViewById( R.id.news_title);
            }
        }

        public  NewsAdapter( List<News> newsLsit){
            mNewsList = newsLsit;
        }

        @Override
        public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            View view = LayoutInflater.from(parent.getContext()).inflate( R.layout.news_item, parent,false);
            final  ViewHolder holder = new ViewHolder(view);
            view.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    News news = mNewsList.get( holder.getAdapterPosition() );
                    if( isTwoPane) {
                        NewsContentFragment newsContentFragment = (NewsContentFragment) getFragmentManager().findFragmentById(R.id.news_content_fragment);
                        newsContentFragment.refresh(news.getTittle(), news.getContent());
                    }else {
                        NewsContentActivity.actionStart( getActivity(), news.getTittle(),news.getContent());
                    }
                }
            });
            return  holder;
        }

        @Override
        public void onBindViewHolder(ViewHolder holder, int position) {
            News news = mNewsList.get(position);
            holder.newsTitleText.setText(news.getTittle());
        }

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


}

这里创建一个新闻标题适配器的内部类，方便访问是单页模式还是双页模式

第十步，创建单页的activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:id="@+id/news_title_layout"
    tools:context="com.example.wangyamin.fragmentbestpractice.MainActivity">

    <fragment
        android:id="@+id/news_title_fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.example.wangyamin.fragmentbestpractice.NewsTitleFragment"/>

</FrameLayout>

表示只有新闻标题

第十一步，创建双页的activity_main.xml 新建layout-sw600dp文件夹，在里面创建一个activity_main.xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <fragment
        android:id="@+id/news_title_fragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:name="com.example.wangyamin.fragmentbestpractice.NewsTitleFragment"/>
   <FrameLayout
       android:id="@+id/news_content_layout"
       android:layout_width="0dp"
       android:layout_height="match_parent"
       android:layout_weight="3">
       <fragment
           android:id="@+id/news_content_fragment"
           android:layout_width="match_parent"
           android:layout_height="match_parent"
           android:name="com.example.wangyamin.fragmentbestpractice.NewsContentFragment"/>
   </FrameLayout>
</LinearLayout>

表示既有标题也有内容，而新闻内容的碎片的id是news_content_layout, 因此可以根据这个Id来判断是双页显示还是单页显示