目标:编写同时兼容平板和手机的APP
- 废话不多说,想写一个简易版的新闻应用,必须用Recyclerview。所以肯定要添加“v7包”。
implementation 'com.android.support:appcompat-v7:28.0.0'
- 既然用到了Recyclerview,那么肯定需要建一个实体类,新闻的实体类News:
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;
}
}
- 新闻内容布局:
<RelativeLayout //相对布局
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/visibility_layout"
android:orientation="vertical"
android:visibility="invisible" //控件不可见
tools:ignore="Orientation,UselessParent">
<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="#000"/>
<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="#000"
tools:ignore="RtlHardcoded">
</View>
</RelativeLayout>
- 启用碎片,先建一个NewsContentFragment类,继承自Fragment类
public class NewsContentFragment extends Fragment {
private View view;
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View 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 =view.findViewById(R.id.news_title);
TextView newsContentText = view.findViewById(R.id.news_content);
newsTitleText.setText(newsTitle); //刷新新闻标题
newsContentText.setText(newsContent); //刷新新闻内容
}
}
——新闻内容的碎片和布局都已经建好
5. 建立新活动NewsContentActivity,自带布局xml命名为news_content,修改它
<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=".NewsContentActivity"
android:orientation="vertical">
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/news_content_fragment"
android:name="activitytest.example.com.fragmentbestpractice.NewsContentFragment"/>
//相当于引用了news_content_flag中的布局
</LinearLayout>
- 修改NewsContentActivity的代码:
public class NewsContentActivity extends AppCompatActivity {
public static void actionStart(Context context,String newsTitle,String newsContent){
Intent intent = new Intent(context,NewsContentActivity.class);
//intent的作业用时获取到了传入新闻的标题和内容,这也就实现了活动和碎片之间的交流。
intent.putExtra("news_title",newsTitle);
*//用intent.putExtra()这个方法来放入自己要传递的数据,然后再另一个地方使用getxxx()来获取*
intent.putExtra("news_content",newsContent);
context.startActivity(intent);
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_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:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/news_title_recycler_view"/>
</LinearLayout>
- 给他一个子项的布局(就是单个item美化):
<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:maxLines="true" //设置1行显示 显示不下的数据会直接不显示
android:ellipsize="end"
//当文字长度超出TextView中显示宽度时,我们可以使用TextView中的ellipsize属性。
android:textSize="18sp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="15dp"
android:paddingBottom="10dp"/>
——新闻列表和子项布局已经建好
9. 再建一个碎片用于展示新闻列表:
public class NewsTitleFragment extends Fragment {
private boolean isTwoPane;
@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;
}
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
if(getActivity().findViewById(R.id.news_content_layout) != null){
//如果能找到这个布局,则为双叶模式,至于为什么接着往下看。
isTwoPane = true;
}else {
isTwoPane = false;
}
}
}
- 让id为“news_content_layout”的View只在双页面模式下出现——限制符:
(1) 修改activity_main中的代码:
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:id="@+id/news_title_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<fragment
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/news_title_fragment"
android:name="activitytest.example.com.fragmentbestpractice.NewsTitleFragment"/>
</FrameLayout>
(2)新建layout_sw600dp文件夹,再建activity_main的文件:构建方法
代码:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="horizontal">
<fragment
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:name="activitytest.example.com.fragmentbestpractice.NewsTitleFragment"
android:id="@+id/news_title_fragment"/>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:id="@+id/news_content_layout"
tools:ignore="Suspicious0dp" >
<fragment
android:name="activitytest.example.com.fragmentbestpractice.NewsContentFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/news_content_fragment"/>
</FrameLayout>
</LinearLayout>
- 复习一下Recycler老一套:Adapter适配器:
public class NewsTitleFragment extends Fragment {
private boolean isTwoPane;
@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);
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 = 1;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 view){
super(view);
newsTitleText = view.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 (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(@NonNull ViewHolder holder, int position) {
News news = mNewsList.get(position);
holder.newsTitleText.setText(news.getTittle());
}
@Override
public int getItemCount() {
return mNewsList.size();
}
}
}