【Android】RecyclerViewの利用
こんにちは。
最近、Android 6.0 Marshmallowの情報キャッチアップをおこなっています。というかこれまで 5.0が出ていながら 4.0系でアプリ作成していたので、いい加減やらねばと思いdevelopersサイトなどを見たりしています。
その中でMaterialDesignで追加されたRecyclerViewを使ってみようとちょっと触ってみたので備忘録がわりに書きます。
参考にさせていただいたサイトは以下です。
http://itnavdev.blogspot.jp/2015/04/recyclerview.html
http://developer.android.com/intl/ja/training/material/lists-cards.html
http://qiita.com/Yuki_312/items/57bd024338528b3527c4
<完成イメージ>
<コード>
build.gradle
まずgradleのdependenciesにrecyclerviewとcardviewを追加します。
1 2 3 4 5 6 7 8 |
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) testCompile 'junit:junit:4.12' compile 'com.android.support:appcompat-v7:23.0.1' compile 'com.android.support:design:23.0.1' compile 'com.android.support:recyclerview-v7:23.0.1' compile 'com.android.support:cardview-v7:23.0.1' } |
MainActivity.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
import android.app.Activity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import java.util.ArrayList; public class MainActivity extends Activity { RecyclerView mRecyclerView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); setLayouts(); } public void setLayouts(){ mRecyclerView = (RecyclerView)findViewById(R.id.recyclerView); mRecyclerView.setLayoutManager(new LinearLayoutManager(getApplicationContext())); mRecyclerView.setHasFixedSize(true); mRecyclerView.setAdapter(new RecyclerViewAdapter(this,getDataList(5))); } private ArrayList<String> getDataList(int i) { ArrayList<String> dataList = new ArrayList<>(); dataList.add("card1"); dataList.add("card2"); dataList.add("card3"); dataList.add("card4"); dataList.add("card5"); return dataList; } } |
BaseActivity.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
import android.app.Activity; import android.view.View; import java.util.ArrayList; /** * Created by takaaki on 15/10/31. */ public abstract class BaseActivity extends Activity implements View.OnClickListener{ protected ArrayList<String> getDataList(int dataSize){ ArrayList<String> dataList = new ArrayList<>(); for (int i=1; i<=dataSize; i++){ dataList.add("card" + i); } return dataList; } } |
RecyclerViewAdapter.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 |
import android.content.Context; import android.support.v7.widget.CardView; import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import android.widget.Toast; import java.util.ArrayList; /** * Created by takaaki on 15/10/31. */ public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> { private LayoutInflater mLayoutInflater; private ArrayList<String> mDataList; private Context mContext; public RecyclerViewAdapter(Context context, ArrayList<String> dataList) { super(); mContext = context; mLayoutInflater = LayoutInflater.from(context); mDataList = dataList; } @Override public RecyclerViewAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType){ View v = mLayoutInflater.inflate(R.layout.card, parent, false); return new ViewHolder(v); } @Override public void onBindViewHolder(final RecyclerViewAdapter.ViewHolder holder, int position){ final String data = mDataList.get(position); holder.text.setText(data); holder.cardView.setOnClickListener(new View.OnClickListener(){ @Override public void onClick(View v){ Toast.makeText(mContext, data + " clicked", Toast.LENGTH_SHORT).show(); } }); } @Override public int getItemCount(){ return mDataList.size(); } static class ViewHolder extends RecyclerView.ViewHolder{ TextView text; CardView cardView; RecyclerView recyclerView; public ViewHolder(View v){ super(v); text = (TextView)v.findViewById(R.id.cardArticleTitle); cardView = (CardView)v.findViewById(R.id.cardView); recyclerView = (RecyclerView)v.findViewById(R.id.recyclerView); } } } |
activity_main.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true" tools:context=".MainActivity"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay"/> </android.support.design.widget.AppBarLayout> <include layout="@layout/content_main"/> </android.support.design.widget.CoordinatorLayout> |
content_main.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" app:layout_behavior="@string/appbar_scrolling_view_behavior" tools:showIn="@layout/activity_main" tools:context=".MainActivity"> <android.support.v7.widget.RecyclerView android:id="@+id/recyclerView" android:layout_width="match_parent" android:layout_height="wrap_content" android:scrollbars="vertical"/> </RelativeLayout> |
card.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/cardLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:weightSum="1" android:elevation="10dp"> <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:card_view="http://schemas.android.com/apk/res-auto" android:id="@+id/cardView" android:layout_width="match_parent" android:layout_height="wrap_content" card_view:cardCornerRadius="4dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:layout_marginTop="10dp" android:foreground="?android:attr/selectableItemBackground" android:layout_marginBottom="10dp"> <FrameLayout android:id="@+id/cardRelative" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center_horizontal" android:orientation="vertical"> <ImageView android:id="@+id/cardArticleImage" android:layout_width="match_parent" android:layout_height="180dp" android:src="@mipmap/ic_launcher" android:adjustViewBounds="true" android:scaleType="center"/> <TextView android:id="@+id/cardArticleTitle" android:layout_width="match_parent" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceLarge" android:text="CardView" android:textSize="13sp" android:gravity="center_vertical" android:textColor="#ffffffff" android:background="#96000000" android:padding="10dp" android:layout_gravity="bottom"/> </FrameLayout> </android.support.v7.widget.CardView> </RelativeLayout> |
※ソースコード内のタブ文字がエスケープ文字で表示されています。すみません。読み替えていただければと思いますm(__)m
こんな感じです。
RecyclerViewは柔軟性のあるListViewのバージョンとの事なので、これから色々アレンジして使ってみたいと思います。
kussuue