Apply material design guidelines to categories

This commit is contained in:
len 2016-12-18 13:08:56 +01:00
parent 36bbb906c1
commit 79705df499
4 changed files with 50 additions and 60 deletions

View file

@ -27,7 +27,9 @@ import nucleus.factory.RequiresPresenter
* UI related actions should be called from here. * UI related actions should be called from here.
*/ */
@RequiresPresenter(CategoryPresenter::class) @RequiresPresenter(CategoryPresenter::class)
class CategoryActivity : BaseRxActivity<CategoryPresenter>(), ActionMode.Callback, FlexibleViewHolder.OnListItemClickListener, OnStartDragListener { class CategoryActivity :
BaseRxActivity<CategoryPresenter>(),
ActionMode.Callback, FlexibleViewHolder.OnListItemClickListener, OnStartDragListener {
/** /**
* Object used to show actionMode toolbar. * Object used to show actionMode toolbar.

View file

@ -1,7 +1,6 @@
package eu.kanade.tachiyomi.ui.category package eu.kanade.tachiyomi.ui.category
import android.view.ViewGroup import android.view.ViewGroup
import com.amulyakhare.textdrawable.util.ColorGenerator
import eu.davidea.flexibleadapter.FlexibleAdapter import eu.davidea.flexibleadapter.FlexibleAdapter
import eu.kanade.tachiyomi.R import eu.kanade.tachiyomi.R
import eu.kanade.tachiyomi.data.database.models.Category import eu.kanade.tachiyomi.data.database.models.Category
@ -17,18 +16,10 @@ import java.util.*
* @param activity activity that created adapter * @param activity activity that created adapter
* @constructor Creates a CategoryAdapter object * @constructor Creates a CategoryAdapter object
*/ */
class CategoryAdapter(private val activity: CategoryActivity) : FlexibleAdapter<CategoryHolder, Category>(), ItemTouchHelperAdapter { class CategoryAdapter(private val activity: CategoryActivity) :
FlexibleAdapter<CategoryHolder, Category>(), ItemTouchHelperAdapter {
/**
* Generator used to generate circle letter icons
*/
private val generator: ColorGenerator
init { init {
// Let generator use Material Design colors.
// Material design is love, material design is live!
generator = ColorGenerator.MATERIAL
// Set unique id's // Set unique id's
setHasStableIds(true) setHasStableIds(true)
} }
@ -54,7 +45,7 @@ class CategoryAdapter(private val activity: CategoryActivity) : FlexibleAdapter<
override fun onBindViewHolder(holder: CategoryHolder, position: Int) { override fun onBindViewHolder(holder: CategoryHolder, position: Int) {
// Update holder values. // Update holder values.
val category = getItem(position) val category = getItem(position)
holder.onSetValues(category, generator) holder.onSetValues(category)
//When user scrolls this bind the correct selection status //When user scrolls this bind the correct selection status
holder.itemView.isActivated = isSelected(position) holder.itemView.isActivated = isSelected(position)

View file

@ -24,7 +24,12 @@ import kotlinx.android.synthetic.main.item_edit_categories.view.*
* *
* @constructor Create CategoryHolder object * @constructor Create CategoryHolder object
*/ */
class CategoryHolder(view: View, adapter: CategoryAdapter, listener: FlexibleViewHolder.OnListItemClickListener, dragListener: OnStartDragListener) : FlexibleViewHolder(view, adapter, listener) { class CategoryHolder(
view: View,
adapter: CategoryAdapter,
listener: FlexibleViewHolder.OnListItemClickListener,
dragListener: OnStartDragListener
) : FlexibleViewHolder(view, adapter, listener) {
init { init {
// Create round letter image onclick to simulate long click // Create round letter image onclick to simulate long click
@ -46,29 +51,31 @@ class CategoryHolder(view: View, adapter: CategoryAdapter, listener: FlexibleVie
* Update category item values. * Update category item values.
* *
* @param category category of item. * @param category category of item.
* @param generator generator used to generate circle letter icons.
*/ */
fun onSetValues(category: Category, generator: ColorGenerator) { fun onSetValues(category: Category) {
// Set capitalized title. // Set capitalized title.
itemView.title.text = category.name.capitalize() itemView.title.text = category.name.capitalize()
// Update circle letter image. // Update circle letter image.
itemView.image.setImageDrawable(getRound(category.name.substring(0, 1).toUpperCase(), generator)) itemView.post {
itemView.image.setImageDrawable(getRound(category.name.take(1).toUpperCase()))
}
} }
/** /**
* Returns circle letter image * Returns circle letter image
* *
* @param text first letter of string * @param text first letter of string
* @param generator the generator used to generate circle letter image
*/ */
private fun getRound(text: String, generator: ColorGenerator): TextDrawable { private fun getRound(text: String): TextDrawable {
val size = Math.min(itemView.image.width, itemView.image.height)
return TextDrawable.builder() return TextDrawable.builder()
.beginConfig() .beginConfig()
.width(size)
.height(size)
.textColor(Color.WHITE) .textColor(Color.WHITE)
.useFont(Typeface.DEFAULT) .useFont(Typeface.DEFAULT)
.toUpperCase()
.endConfig() .endConfig()
.buildRound(text, generator.getColor(text)) .buildRound(text, ColorGenerator.MATERIAL.getColor(text))
} }
} }

View file

@ -1,53 +1,43 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" <FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeightLarge" android:layout_height="@dimen/material_component_lists_single_line_with_avatar_height"
android:paddingTop="8dp" android:background="?attr/selectable_list_drawable">
android:paddingBottom="8dp"
android:background="?attr/selectable_list_drawable"
>
<ImageView <ImageView
android:id="@+id/image" android:id="@+id/image"
android:layout_width="50dp" android:layout_width="@dimen/material_component_lists_single_line_with_avatar_height"
android:layout_height="50dp" android:layout_height="@dimen/material_component_lists_single_line_with_avatar_height"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerInParent="true"
android:clickable="true" android:clickable="true"
android:layout_marginLeft="@dimen/margin_left" android:paddingLeft="@dimen/material_component_lists_icon_left_padding"
android:layout_marginStart="@dimen/margin_left" android:paddingStart="@dimen/material_component_lists_icon_left_padding"
android:layout_marginRight="@dimen/margin_right" android:paddingRight="0dp"
android:layout_marginEnd="@dimen/margin_right"/> android:paddingEnd="0dp"/>
<android.support.v7.widget.AppCompatImageView
android:id="@+id/reorder"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="@dimen/margin_left"
android:layout_marginStart="@dimen/margin_left"
android:layout_marginRight="@dimen/margin_right"
android:layout_marginEnd="@dimen/margin_right"
android:scaleType="center"
android:layout_centerInParent="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
app:srcCompat="@drawable/ic_reorder_grey_24dp"
android:tint="?android:attr/textColorPrimary"/>
<TextView <TextView
android:id="@+id/title" android:id="@+id/title"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_toRightOf="@id/image" android:layout_marginLeft="@dimen/material_component_lists_text_left_padding"
android:layout_toEndOf="@id/image" android:layout_marginStart="@dimen/material_component_lists_text_left_padding"
android:layout_toLeftOf="@id/reorder" android:layout_marginRight="@dimen/material_component_lists_single_line_with_avatar_height"
android:layout_toStartOf="@id/reorder" android:layout_marginEnd="@dimen/material_component_lists_single_line_with_avatar_height"
android:layout_centerInParent="true"
android:ellipsize="end" android:ellipsize="end"
android:maxLines="1" android:maxLines="1"
android:layout_gravity="center_vertical"
android:textAppearance="@style/TextAppearance.Regular.SubHeading" android:textAppearance="@style/TextAppearance.Regular.SubHeading"
tools:text="Title"/> tools:text="Title"/>
</RelativeLayout> <ImageView
android:id="@+id/reorder"
android:layout_width="@dimen/material_component_lists_single_line_with_avatar_height"
android:layout_height="@dimen/material_component_lists_single_line_with_avatar_height"
android:scaleType="center"
android:layout_gravity="end"
app:srcCompat="@drawable/ic_reorder_grey_24dp"
android:tint="?android:attr/textColorPrimary"/>
</FrameLayout>