RecyclerView and CardView in Android

Duration

10 minutes

Tip: If you are doing this exercise live in a session, make sure to make good use of the instructor, they are online to answer any questions you have!

Goals

In this exercise, you will wrap the LinearLayout at the root of your item-layout file with a CardView

Required assets

The provided Resources folder for this part contains a subfolder named Completed with a solution you can use to check your work. This lab is a continuation of the previous one. If you did not complete the previous exercise, you can use the Completed solution from the previous part as starter code for this part.

Challenge

Use the guidelines here to utilize a CardView. Alternatively, you can use the step-by-step instructions given below.

  1. Add the CardView package to your project.
  2. Add a CardView as the root of your item-layout file.

Steps

Below are the step-by-step instructions to implement the exercise.

Add the package

  1. Add the Xamarin Support Library v7 CardView NuGet package to your project.

Use a card as your root layout

  1. Open Restaurant.axml.
  2. Wrap a CardView around the existing LinearLayout. A sample start tag you can use is shown below.
    <android.support.v7.widget.CardView
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginTop  ="8dp"
      android:layout_marginLeft ="8dp"
      android:layout_marginRight="8dp">
    
  3. Run the app to test your work. On some versions, the default colors make it hard to see the cards (e.g. a black card against a black background). You can set a background color on the LinearLayout in Main.axml in this case; for example, android:background="#ff9e9e9e".

Summary

In this section, you used a CardView as part of your item-layout file.

Go Back