Android之Fragment应用

内容:
1、准备工作
2、新建一个新闻的实体类News
3、新建布局文件news_content_frag.xml,作为新闻内容的布局
4、NewsContentFragment类,继承自Fragment
5、新建NewsContentActivity活动,将布局名指定为
news_content.xml
6、创建一个实现新闻列表的布局news_title_frag.xml
7、新建news_item.xml,作为RecyclerView子项的布局
8、新建展示新闻列表的碎片NewsTitleFragment
9、在NewsTitleFragment中新建一个内部类NewsAdapter来作为RecyclerView的适配器
10、修改NewsTitleFragment中的代码

一、准备工作
在app/build.gradle的dependencies中,加入以下一行代码

implementation 'androidx.recyclerview:recyclerview:1.1.0'

二、 新建一个新闻的实体类News

package com.example.fragmenttest; public class News { private String title;//新闻标题 private String content;//新闻内容 public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getContent() { return content; } public void setContent(String content) { this.content = content; } } 

三、新建布局文件news_content_frag.xml,作为双页模式下新闻内容部分的布局

在xml文件中设置android:visibility="invisible"
故在应用时,应将该设置修改为visible

<?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/visiblity_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:visibility="invisible"> <!-- 1、头部部分:显示新闻标题 --> <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="10dp" android:background="#000"/> <!-- 2、正文部分:显示新闻内容 --> <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="match_parent" android:layout_height="1dp" android:layout_alignParentLeft="true" android:background="#000"/> </RelativeLayout> 

四、创建两种模式下共用新闻内容的Fragment:NewsContentFragment类,继承自Fragment

invisible修改为visible状态:
visibilityLayout.setVisibility(View.VISIBLE);

package com.example.fragmenttest; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import androidx.annotation.NonNull; import androidx.annotation.Nullable; import androidx.fragment.app.Fragment; /** * NewsContentFragment类,继承自Fragment */ public class NewsContentFragment extends Fragment{ private View view; /** * * 加载刚创建好的news_content_frag布局 * * @param inflater * @param container * @param savedInstanceState * @return */ @Nullable @Override public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { /** * resource : 它是要解析的XML文件的id号(必填) * root : 如果传入不为空, attachToRoot也为true, 就把XML解析后的view加入root子控件, 然后返回这个root. * 否则, 就返回一个解析之后的XML生成的view. * attachToRoot : 决定是否让root成为返回值的父控件 * */ view=inflater.inflate(R.layout.news_content_frag,container,false); return view; } /** * * 将新闻标题和新闻内容显示在界面上 * * @param newsTitle * @param newsContent */ public void refresh(String newsTitle,String newsContent){ View visibilityLayout=view.findViewById(R.id.visiblity_layout); visibilityLayout.setVisibility(View.VISIBLE); //分别获取到新闻标题和新闻内容的控件 TextView newsTilteText=(TextView)view.findViewById(R.id.news_title); TextView newsContentText=(TextView)view.findViewById(R.id.news_content); //刷新新闻的标题和内容 newsTilteText.setText(newsTitle); newsContentText.setText(newsContent); } } 

五、新建NewsContentActivity活动:单页模式下引用NewsContentFragment的Activity;
将布局名指定为news_content.xml:单页模式下新闻内容部分的布局

1、news_content.xml

充分发挥代码的复用性,在布局中直接引入NewsContentFragment
这样也相当于把news_content_frag布局的内容自动加了进来

android:name="com.example.fragmenttest.NewsContentFragment"

 <?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" > <fragment android:id="@+id/news_content_fragment" android:name="com.example.fragmenttest.NewsContentFragment" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout> 

2、NewsContentActivity

package com.example.fragmenttest; import android.content.Context; import android.content.Intent; import android.os.Bundle; import androidx.appcompat.app.AppCompatActivity; /** * NewsContentActivity,继承自AppCompatActivity */ public class NewsContentActivity extends AppCompatActivity { /** * 启动活动的最佳方法:无须阅读其他代码,就可以非常清晰的指导启动NewsContentActivity需要传递拿些数据 * @param context * @param newsTitle * @param newsContent */ 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); } /** * * 通过Intent获取到了传入的新闻标题和新闻内容,然后调用FragmentManager的findFragmentById()方法 * 得到 NewsContentFragment的实例,接着调用 NewsContentFragment 的 refresh()方法 * * @param savedInstanceState */ @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); } } 

六、创建布局news_title_frag.xml:两种模式下共用新闻标题列表的布局

在这里用到了RecyclerView,那么就必定少不了子项的布局
之后会新建news_item.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"> <androidx.recyclerview.widget.RecyclerView android:id="@+id/news_title_recycler_view" android:layout_width="match_parent" android:layout_height="match_parent"/> </LinearLayout> 

七、新建布局news_item.xml:新闻标题列表的子布局(作为RecyclerView子项的布局)

设定当文本内容超出空间宽度时,文本的缩略方式,这里指定成end,表示在尾部进行缩略
android:ellipsize="end"

设置这个TextView只能单行显示
android:singleLine="true"

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

八、新建NewsTitleFragment:两种模式下新闻标题部分的碎片

package com.example.fragmenttest; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import androidx.annotation.NonNull; import androidx.annotation.Nullable; import androidx.fragment.app.Fragment; public class NewsTitleFragment extends Fragment { private boolean isTwoPage; @Nullable @Override public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view=inflater.inflate(R.layout.news_title_frag,container,false); return view; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); if(getActivity().findViewById(R.id.news_content_layout)!=null){ isTwoPage = true; } else{ isTwoPage=false; } } } 

通过在活动中能否找到一个id为news_content_layout的View来判断当前是双页模式还是单页模式

因此,需要修改activity_main.xml的代码:单页模式下,只加载一个新闻标题的碎片布局

<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/news_title_layout" android:layout_width="match_parent" android:layout_height="match_parent"> <fragment android:id="@+id/news_title_fragment" android:name="com.example.fragmenttest.NewsTitleFragment" android:layout_width="match_parent" android:layout_height="match_parent" /> </FrameLayout> 

通过限定符的方式系统区分运行的大屏幕还是小屏幕,新建适配大屏幕的布局文件夹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:name="com.example.fragmenttest.NewsTitleFragment" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <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:name="com.example.fragmenttest.NewsContentFragment" android:layout_width="match_parent" android:layout_height="match_parent" /> </FrameLayout> </LinearLayout> 

九、在NewsTitleFragment中新建一个内部类NewsAdapter来作为RecyclerView的适配器

package com.example.fragmenttest; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import androidx.annotation.NonNull; import androidx.annotation.Nullable; import androidx.fragment.app.Fragment; import androidx.recyclerview.widget.RecyclerView; import java.util.List; public class NewsTitleFragment extends Fragment { private boolean isTwoPage; @Nullable @Override public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view=LayoutInflater.from(getContext()).inflate(R.layout.news_content_frag,container, false); return view; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); if(getActivity().findViewById(R.id.news_content_layout)!=null){ isTwoPage = true; } else{ isTwoPage=false; } } class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.ViewHolder>{ private List<News> mNewsList; public class ViewHolder extends RecyclerView.ViewHolder{ TextView newsTitleText; public ViewHolder(@NonNull View itemView) { super(itemView); newsTitleText=(TextView) itemView.findViewById(R.id.news_title); } } public NewsAdapter(List<News> newsList){ mNewsList = newsList; } @NonNull @Override public ViewHolder onCreateViewHolder(@NonNull 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(isTwoPage){ //如果是双页模式,则刷新NewsContentFragment的内容 NewsContentFragment newsContentFragment= (NewsContentFragment)getFragmentManager().findFragmentById(R.id.news_content_fragment); newsContentFragment.refresh(news.getTitle(),news.getContent()); news.getContent(); } else{ //如果是单页模式,则直接启动NewsContentActivity NewsContentActivity.actionStart(getActivity(),news.getTitle(),news.getContent()); } } }); return holder; } @Override public void onBindViewHolder(@NonNull ViewHolder holder, int position) { News news=mNewsList.get(position); holder.newsTitleText.setText(news.getTitle()); } @Override public int getItemCount() { return mNewsList.size(); } } } 

十、修改NewsTitleFragment中的代码

1、修改onCreateView

 @Nullable @Override public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view=LayoutInflater.from(getContext()).inflate(R.layout.news_content_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; } 

2、新增getNews

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

3、新增getRandomLengthContent

 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(); } 

十一、主活动MainActivity.java

public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } } 

十二、运行效果

1、在手机上
在这里插入图片描述
[文件]
在这里插入图片描述

2、在平板上
在这里插入图片描述

原文链接:https://blog.csdn.net/qq_39438055/article/details/104152342?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522165277607816782395317734%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=165277607816782395317734&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-18-104152342-null-null.nonecase&utm_term=%E6%96%B0%E9%97%BB

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发
头像
文明发言,共建和谐米科社区
提交
头像

昵称

取消
昵称表情图片