iT邦幫忙

2022 iThome 鐵人賽

DAY 11
0
Mobile Development

Android studio 30天初學筆記系列 第 11

[Android Studio 30天挑戰] Day11 - 介紹RecyclerView(上)

  • 分享至 

  • xImage
  •  

今天要講解的是RecyclerView,這是一個非常實用的一個元件,每種app都會有列表式的資料,這時就是它出場的時機了,而它作為ListView的強化版,它提供更完善的功能,更有超做的靈活性,有助於客製化各種不同的介面。/images/emoticon/emoticon24.gif

依賴

一樣的請到build.grade(Module: app)的dependencies加入依賴。

dependencies{
    implementation "androidx.recyclerview:recyclerview:1.2.1"
    implementation "androidx.recyclerview:recyclerview-selection:1.1.0"
}

介面

我們除了要在activity.xml新增recyclerview的元件外,還要再layout裡新增一個xml。
https://ithelp.ithome.com.tw/upload/images/20220716/20150369WcuESsG2tX.png
這裡我把介面設定成下面圖片。
https://ithelp.ithome.com.tw/upload/images/20220729/201503696amcAAmZiH.png

程式碼

我們先來看主程式的部分

public class MainActivity extends AppCompatActivity {
    //設定變數
    private RecyclerView recyclerView;
    private MyAdapter adapter;
    private LinearLayoutManager manager;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //綁定元件
        recyclerView=(RecyclerView) findViewById(R.id.recyclerView);
        init();
    }
    public void init(){
        //設定recyclerView要用的的manager和adapter
        adapter=new MyAdapter();
        recyclerView.setAdapter(adapter);
        manager=new LinearLayoutManager(this);
        recyclerView.setLayoutManager(manager);
    }

接下來來看Adapter的部分

RecyclerViewAdapter種共有三個要複寫的函式。

  1. public void onBindViewHolder(@NonNull MyAdapter.ViewHolder holder, int position)
  2. public int getItemCount()
  3. public MyAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType)
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
    //把圖片放入陣列
    private int img[]={R.drawable.img1,R.drawable.img2,R.drawable.img3
    ,R.drawable.img4,R.drawable.img5};
    public class ViewHolder extends RecyclerView.ViewHolder {
        //宣告變數。
        private ImageView imageView;
        public ViewHolder(@NonNull View v) {
            super(v);
            //綁定元件。
            imageView=v.findViewById(R.id.imageView);
        }
    }
    @NonNull
    @Override
    public MyAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType)
    {
        //連結布局xml檔item。
        View view = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.item, parent, false);
        return new ViewHolder(view);
    }
    // 設置元件要顯示的內容和格式。
    @Override
    public void onBindViewHolder(@NonNull MyAdapter.ViewHolder holder, int position) {
        holder.imageView.setImageResource(img[position]);

    }
    //列表要建立長度。
    @Override
    public int getItemCount() {
        return 5;
    }
}

最後的成果長這樣。/images/emoticon/emoticon07.gifhttps://ithelp.ithome.com.tw/upload/images/20220729/20150369P0PbyRyK2a.png


上一篇
[Android Studio 30天挑戰] Day10 - 介紹Toolbar
下一篇
[Android Studio 30天挑戰] Day12 - 介紹RecyclerView(下)
系列文
Android studio 30天初學筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言