使用Fragment,宽度限定符 实现新闻列表,手机平板适配————第一行代码

展示
手机界面

在这里插入图片描述

平板界面

在这里插入图片描述

例子下载

https://download.csdn.net/download/ljp345775/12478162

实现的思路

  1. 是要准备两个Fragment,一个是TitleFragment,用来展示新闻列表的,另外一个是ContentFragment,似乎用来展示新闻详情的。
  2. 是要准备两个布局,一个是手机的布局,里面就放一个TitleFragment,然后用户点击列表的item,然后实现跳转到新闻详情界面,另外一个是平板的布局,由于平板的屏幕比较大,所以,新闻列表和详情在同意界面,然后根据用户点击列表的item,实现详情界面修改数据,但是需要在res文件夹下新建一个名字为:layout-sw600dp 的文件夹用来存放平板的布局,如下图所示:
在这里插入图片描述

  3. 要在用户点击item的时候 判断是 手机 还是 平板,如果是 手机 就跳转,如果是 平板,就刷新数据,在Kotlin中实现的思路就是 因为程序会根据是 手机或者平板来加载不同的布局,也就是说 如果是手机,就会加载layout文件夹下的activity_main.xml,如果是平板的话,就会加载layout-sw600dp文件夹的activity_main.xml ,所以,我们就可以判断布局文件中是否包含新闻详情界面来判断是手机韩式平板了。如下图:
在这里插入图片描述

代码
新闻列表 NewsTitleFragment
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.fragment.app.Fragment
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView
import com.example.kotlindemo3.MainActivity
import com.example.kotlindemo3.NewsContentActivity
import com.example.kotlindemo3.R
import com.example.kotlindemo3.beans.News
import kotlinx.android.synthetic.main.activity_main.*
import kotlinx.android.synthetic.main.fragment_newstitle.*

/**
 * @作者: ljp
 * @时间: 2020/5/30 14:46
 * @描述:用来展示新闻列表
 **/
class NewsTitleFragment : Fragment() {
    //页面上是否有两个fragment
    //用来判断是手机 韩式平板
    var isTwo = false

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_newstitle, container, false)
    }

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        //通过判断布局中是否包含新闻详情界面来判断 是否为平板
        isTwo = activity?.findViewById<View>(R.id.newsContentFrag) != null
        val list = getNews()
        val adapter = NewsAdapter(list)
        val manager = LinearLayoutManager(activity)
        recyc_titles.layoutManager = manager
        recyc_titles.adapter = adapter
        if (isTwo) {
            //如果是平板 详情界面默认显示第一条数据
            var news = list[0]
            val fragment = newsContentFrag as NewsContentFragment
            fragment.refresh(news.title, news.content)
            (activity as MainActivity).supportActionBar?.title = "平板"
        } else {
            (activity as MainActivity).supportActionBar?.title = "手机"
        }
    }
    /**
     * 内部类 RecyclerView 的适配器
     */
    inner class NewsAdapter(val list: ArrayList<News>) :
        RecyclerView.Adapter<NewsAdapter.VH>() {
        inner class VH(view: View) : RecyclerView.ViewHolder(view) {
            val tv_title_item_recyc: TextView = view.findViewById(R.id.tv_title_item_recyc)
        }

        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): VH {
            val view =
                LayoutInflater.from(parent.context).inflate(R.layout.item_recyc, parent, false)
            val vh = VH(view)
            //给item设置点击事件
            vh.itemView.setOnClickListener {
                var adapterPosition = vh.adapterPosition
                var news = list[adapterPosition]
                //判断是否为平板,如果是,就展示详情
                if (isTwo) {
                    val fragment = newsContentFrag as NewsContentFragment
                    fragment.refresh(news.title, news.content)
                } else {
                    //如果为手机,就跳转到详情界面
                    NewsContentActivity.startAction(parent.context, news.title, news.content)
                }
            }
            return vh
        }

        override fun getItemCount() = list.size

        override fun onBindViewHolder(holder: VH, position: Int) {
            var news = list[position]
            holder.tv_title_item_recyc.text = news.title
        }

    }
    private fun getNews(): ArrayList<News> {
        val list = ArrayList<News>()

        for (i in 1..50) {
            val news = News("这是标题 $i", getRandomString("这是新闻内容 $i"))
            list.add(news)
        }
        return list
    }

    private fun getRandomString(str: String): String {
        val r = (1..30).random()
        val b = StringBuilder()
        repeat(r) {
            b.append(str)
        }
        return b.toString()
    }
}
新闻详情 NewsContentFragment(用于平板)
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
import com.example.kotlindemo3.R
import kotlinx.android.synthetic.main.fragment_newscontent.*

/**
 * @作者: ljp
 * @时间: 2020/5/30 15:15
 * @描述:新闻详情界面
 **/
class NewsContentFragment : Fragment() {
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_newscontent, container, false)
    }

    //把数据展示到页面上
    fun refresh(title: String, content: String) {
        tv_title_contentfrag.text = title
        tv_content_contetnfrag.text = content
    }

}
新闻详情 NewsContentActicity(用于手机)
import android.content.Context
import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import com.example.kotlindemo3.fragment.NewsContentFragment
import kotlinx.android.synthetic.main.activity_news_content.*

class NewsContentActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_news_content)
        getDataFromPre()
    }

    private fun getDataFromPre() {
        var title = intent.getStringExtra("title")
        var content = intent.getStringExtra("content")
        if (title != null && content != null) {
            val fragment = frag_newscontent as NewsContentFragment
            fragment.refresh(title, content)
        }
    }

    companion object {
        fun startAction(context: Context, title: String, content: String) {
            val intent = Intent(context, NewsContentActivity::class.java).apply {
                putExtra("title", title)
                putExtra("content", content)
            }
            context.startActivity(intent)

        }
    }

}

layout 文件夹下的activity_main.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=".MainActivity">

    <fragment
        android:id="@+id/newsTitleFrag"
        android:name="com.example.kotlindemo3.fragment.NewsTitleFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>
layout-sw600dp 文件夹下的activity_main.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"
    android:orientation="horizontal"
    tools:context=".MainActivity">

    <fragment
        android:id="@+id/newsTitleFrag"
        android:name="com.example.kotlindemo3.fragment.NewsTitleFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_marginStart="2dp"
        android:layout_marginEnd="2dp"
        android:background="#000" />

    <fragment
        android:id="@+id/newsContentFrag"
        android:name="com.example.kotlindemo3.fragment.NewsContentFragment"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="3" />

</LinearLayout>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章