【安卓学习】4.碎片(Fragment)实践---一个简单的新闻应用。
来源:互联网 发布:倚天财经实时数据 编辑:程序博客网 时间:2024/05/29 16:37
很多时候我们希望我们的app能够在手机/Pad上通用,但是Pad屏幕面积比较大,手机上可以一个屏幕都在展示一个项目,但是如果平板也这样,可能就比较浪费,为了应对这个问题,安卓有一个特别好用的东西,叫碎片Fragment。具体的可以看前面的博客。
1.修改build.gradle,添加依赖的类库。
首先,创建一个安卓项目:SimpleNewsApp,因为我们项目中使用到了RecyclerView,因此需要在app/build.gradle中添加依赖库,如下图所示:
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', { exclude group: 'com.android.support', module: 'support-annotations' }) compile 'com.android.support:appcompat-v7:25.3.1' compile 'com.android.support:recyclerview-v7:25.3.1' testCompile 'junit:junit:4.12'}其中,第7行就是我们需要添加的东西。
2.创建News类,新闻实体类
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; }}
这个就是一个普通实体类,没什么好说的。3.新建布局文件news_content_frag.xml布局,用于新闻内容的布局。
<?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="#000000" /> <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="#000000" /></RelativeLayout>
这里重要的是有两个<TextView>,第一个id为news_title,用来显示新闻的标题,第二个id为news_content,用来显示新闻的内容。其中<View>标签是用来分割标题与内容的,即中间的那条黑色的细线。设置width宽度为1,背景颜色为#000000黑色。
截至目前,我们已经有了一个展示新闻的布局,以及一个新闻的实体。
4.新建一个NewsContentFrage类,继承了Fragment(support.v4下面的)。
private View view; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, 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); }
这个碎片类的作用是,展示新闻的内容。
首先在onCreateView()方法加载了我们的news_content_frag布局。下面的refresh()方法则是将新闻的标题内容显示出来。
目前为止,我们已经创建好了新闻内容的碎片与布局。这个只是在双页模式下使用的,如果不知道什么是双页模式,可以看我前一篇博客。接下来我们需要实现单页模式下使用。单页下,其实就是一个新的活动。
5.创建布局命名为news_content.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" > <fragment android:id="@+id/news_content_fragment" android:name="com.example.ustcg.simplenewsapp.NewsContentFragment" android:layout_width="match_parent" android:layout_height="match_parent"/></LinearLayout>
我们在这里重用了代码,直接布局中引入了NewsContentFragement,这样就相当于把news_content_frage布局的内容添加进来。代码比较就简单,我们继续下面的。
6.创建布局对应的活动,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); }}
首先在onCreate()方法中,我们通过getIntent,然后在intent中获取到传入的新闻标题与内容。获取之后,我们该怎么展示呢?当然实在fragment,即碎片。怎么做呢,首先我们获取到目标碎片(fragment)的实例,getSupportFragmentManager().findFragmentById(R.id.news_content_fragment)即实现这个功能,然后调用碎片中的refresh方法,将标题与内容传入,然后显示出来。
actionStart方法的用途,类似实现一个intent,但是为什么不写在源activity而是目标activity?原因比较简单,如果写在了目标的activity,源activity调用的时候,就需要传入规定的参数。使用情景就是:假如两个activity是两个不同的人开发的,当一个人需要跳转的另外一个人的activiy时,需要提供参数,但是怎么知道需要提供哪些参数呢?如果不用这种方式,那么这个人就需要去都目标activity的代码,然后才能知道需要提供什么数据。
7.创建一个显示新闻列表的布局,news_title_frag.xml
<?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"> <android.support.v7.widget.RecyclerView android:id="@+id/news_title_recycler_view" android:layout_width="match_parent" android:layout_height="match_parent" /></LinearLayout>
代码比较少,比较简单,其实主要是用到了一个显示新闻列表的RecyclerView标签,具体的作用,可以百度。嘿嘿。用到了RecyclerView就要定义子项的布局,接下来我们定义子项布局。
8.子项布局news_item.xml
<TextView xmlns:android="http://schemas.android.com/apk/res/android" 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,几个关键的属性介绍一下,android:singleLine="true"的含义是让这个TextView只会单行显示,android:ellipsize设置文本内容超出控件宽度之后文本的缩略方式,end表示尾部缩略。其他的都比较简单,如果看不明白可以百度。
新闻列表以及子项的布局都已经创建好了,接下来就需要找一个展示的地方了。
9.创建NewsTitleFragment作为展示的的碎片
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); return view; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); if (getActivity().findViewById(R.id.news_content_layout) != null) { isTwoPane = true; } else { isTwoPane = false; } }}
代码简单,在onCreateView()方法中加载了news_title_frag布局,在onActiivityCreated中主要是添加了一个标志,判断当前是双页模式还是单页模式,即平板还是手机。怎
么才能实现判断的功能呢?这个比较简单。
10.创建两个activity_main.xml布局
这两个布局文件不能放到一个地方,不然就重名报错了。一个放在layout下面,作为普通的布局,即手机布局。另一个需要放到一个新的文件夹layout-sw600dp下面,即
机器像素大于600dp使用的布局,即平板布局。系统会自动根据你的机器尺寸选择合适的布局。
layout文件夹下的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.ustcg.simplenewsapp.NewsTitleFragment" android:layout_width="match_parent" android:layout_height="match_parent"/></FrameLayout>单页模式下,只加载NewsTitleFragment的碎片。
layout-sw600dp文件夹下的activity_main.xml代码:
<?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="horizontal"> <fragment android:id="@+id/news_title_fragment" android:name="com.example.ustcg.simplenewsapp.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.ustcg.simplenewsapp.NewsContentFragment" android:layout_width="match_parent" android:layout_height="match_parent"/> </FrameLayout></LinearLayout>
这里加载了两个碎片,并把新闻内容碎片放在了一个FrameLayout布局下面,布局的id为news_content_layout,如果能找到这个id,则证明为双页模式,即平板。斗则就是
手机。
至此我i们完成了大部分工作。接下来我们需要在NewsTitleFragment碎片中,通过RecyclerView将新闻咧白哦展示出来。这个比较复杂。
11.修改NewsTitleFragment
public class NewsTitleFragment extends Fragment { private boolean isTwoPane; class NewsAdapter extends RecyclerView.Adapter<NewsAdapter.ViewHolder> { private List<News> mNewsList; class ViewHolder extends RecyclerView.ViewHolder { TextView newsTitleText; public ViewHolder(View view) { super(view); newsTitleText = (TextView) view.findViewById(R.id.news_title); } } public NewsAdapter(List<News> newsList) { mNewsList = newsList; } @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.getTitle(), news.getContent()); } else { NewsContentActivity.actionStart(getActivity(), news.getTitle(), news.getContent()); } } }); return holder; } @Override public void onBindViewHolder(NewsAdapter.ViewHolder holder, int position) { News news = mNewsList.get(position); holder.newsTitleText.setText(news.getTitle()); } @Override public int getItemCount() { return mNewsList.size(); } } @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.setTitle("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; } }}
原谅我比较懒,直接把这个类粘贴出来了。
首先最开始我们新建了一个内部类NewsAdapter作为RecyclerView的适配器。很抱歉的是,我对于适配器的代码也没太搞明白,因此这里就先不说了,直接跳过,后期在我
搞明白之后,我会再来编辑的。
其他的代码就比较简单了,就不解释了。直接运行吧。
项目代码我已经放到github上了,你们可以去download。简单的新闻安卓app
有问题可以留言,大家一起探讨吧,毕竟我现在还没入门。
- 【安卓学习】4.碎片(Fragment)实践---一个简单的新闻应用。
- Fragment最佳实践---------一个简易版的新闻应用
- Fragment碎片应用--新闻APP
- 碎片的最佳实践——一个简易版的新闻应用
- 碎片的最佳实践——一个简易版的新闻应用
- 安卓Fragment 碎片!!!
- 碎片的最佳实践——简易版新闻应用
- 安卓在一个活动(Activity)里加载碎片(Fragment)并切换到另一个碎片(Fragment)
- 第 4 章 探究碎片最佳实践之简易版的新闻应用
- HorizontalScrollView+TabLayout+Fragment简单新闻类应用的头部
- 安卓开发25:碎片 Fragment使用
- 详解安卓Fragment(碎片化)
- 安卓新闻客户端的简单实现
- 一个小时写一个简单的iOS新闻应用
- Android:使用fragment(碎片)—让你的应用更灵活(一)简单运用
- 安卓活动(Activity)和碎片(Fragment)的生命周期
- 安卓漫漫路之碎片Fragment不同包下的区别.
- 安卓碎片fragment菜单侧滑slidingmenu
- Android串口log的获取
- 【Angular】理解$S
- Git (持续更新)
- flask_Linux
- MySQL字符串拼接
- 【安卓学习】4.碎片(Fragment)实践---一个简单的新闻应用。
- transient和volatile总结
- application 对象-6.14
- 01-jdbc回顾
- Out对象-6.15
- IP Networks
- Servlet
- visual studio code(vscode)的使用(快捷键)
- 自定义View测量两指间距离和两指间中点