Android - Search - Ripple effect on items and rounded corners using CardView

This commit is contained in:
Cristian Luis Duarte 2018-04-23 21:43:27 -03:00
parent c33f1fbbb1
commit 52ef935acb
6 changed files with 43 additions and 42 deletions

View file

@ -104,6 +104,7 @@ dependencies {
implementation 'com.android.support:design:26.1.0' implementation 'com.android.support:design:26.1.0'
implementation 'com.android.support:appcompat-v7:26.1.0' implementation 'com.android.support:appcompat-v7:26.1.0'
compile 'com.android.support:recyclerview-v7:26.1.0' compile 'com.android.support:recyclerview-v7:26.1.0'
compile 'com.android.support:cardview-v7:26.1.0'
compile 'com.squareup.retrofit2:retrofit:2.4.0' compile 'com.squareup.retrofit2:retrofit:2.4.0'
compile 'com.squareup.retrofit2:converter-gson:2.4.0' compile 'com.squareup.retrofit2:converter-gson:2.4.0'

View file

@ -1,10 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="1dp" android:left="12dp" android:bottom="6dp" android:right="12dp">
<shape android:shape="rectangle">
<solid android:color="@color/backgroundDark" />
<corners android:radius="4dp"/>
</shape>
</item>
</layer-list>

View file

@ -18,7 +18,7 @@
android:id="@+id/toolbar" android:id="@+id/toolbar"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" android:background="?attr/colorPrimaryDark"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" /> android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />
<include layout="@layout/content_home" /> <include layout="@layout/content_home" />

View file

@ -1,35 +1,44 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="170dp" android:layout_height="170dp"
android:paddingLeft="14dp" android:layout_marginStart="14dp"
android:paddingRight="14dp" android:layout_marginEnd="14dp"
android:paddingTop="4dp" android:layout_marginTop="4dp"
android:paddingBottom="4dp" android:layout_marginBottom="4dp"
android:background="@drawable/domain_bg"> android:foreground="@drawable/rippleable"
<ImageView android:clickable="true"
android:id="@+id/domainThumbnail" android:focusable="true"
android:layout_width="match_parent" android:elevation="0dp"
android:layout_height="match_parent" app:cardElevation="0dp"
android:scaleType="centerCrop" app:cardCornerRadius="@dimen/item_corner_radius">
app:srcCompat="@android:drawable/ic_menu_gallery" />
<TextView <android.support.constraint.ConstraintLayout
android:id="@+id/domainName"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="60dp" android:layout_height="match_parent">
android:fontFamily="@font/raleway_semibold"
android:paddingStart="10dp" <ImageView
android:paddingEnd="10dp" android:id="@+id/domainThumbnail"
android:gravity="center_vertical" android:layout_width="match_parent"
android:text="" android:layout_height="match_parent"
android:textSize="21sp" android:scaleType="centerCrop"
android:textColor="@color/white_opaque" app:srcCompat="@android:drawable/ic_menu_gallery" />
android:background="@color/domainTextBg"
app:layout_constraintBottom_toBottomOf="parent" <TextView
app:layout_constraintLeft_toLeftOf="parent" /> android:id="@+id/domainName"
<!--android:layout_marginBottom="14dp" android:layout_width="match_parent"
android:layout_marginStart="10dp"--> android:layout_height="60dp"
</android.support.constraint.ConstraintLayout> android:fontFamily="@font/raleway_semibold"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:gravity="center_vertical"
android:text=""
android:textSize="21sp"
android:textColor="@color/white_opaque"
android:background="@color/black_060"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>

View file

@ -2,7 +2,7 @@
<resources> <resources>
<color name="white_opaque">#ffffff</color> <color name="white_opaque">#ffffff</color>
<color name="colorPrimary">@color/backgroundLight</color> <color name="colorPrimary">@color/backgroundLight</color>
<color name="colorPrimaryDark">#000000</color> <color name="colorPrimaryDark">@color/backgroundDark</color>
<color name="colorAccent">#54D7FD</color> <color name="colorAccent">#54D7FD</color>
<color name="backgroundEditText">#E3E3E3</color> <color name="backgroundEditText">#E3E3E3</color>
<color name="editTextColor">#575757</color> <color name="editTextColor">#575757</color>
@ -15,5 +15,5 @@
<color name="editTextHint">#9e9e9e</color> <color name="editTextHint">#9e9e9e</color>
<color name="menuOption">#F2F2F2</color> <color name="menuOption">#F2F2F2</color>
<color name="colorLoginError">#FF7171</color> <color name="colorLoginError">#FF7171</color>
<color name="domainTextBg">#7F000000</color> <color name="black_060">#99000000</color>
</resources> </resources>

View file

@ -11,4 +11,5 @@
<dimen name="text_size_subtitle_material_toolbar">12dp</dimen> <dimen name="text_size_subtitle_material_toolbar">12dp</dimen>
<dimen name="button_horizontal_margin">12dp</dimen> <dimen name="button_horizontal_margin">12dp</dimen>
<dimen name="edit_text_padding">8dp</dimen> <dimen name="edit_text_padding">8dp</dimen>
<dimen name="item_corner_radius">4dp</dimen>
</resources> </resources>