Apply material design guidelines to categories
This commit is contained in:
parent
36bbb906c1
commit
79705df499
@ -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.
|
||||||
|
@ -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)
|
||||||
|
@ -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))
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -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:tools="http://schemas.android.com/tools"
|
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"
|
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||||
android:layout_height="?android:attr/listPreferredItemHeightLarge"
|
android:layout_width="match_parent"
|
||||||
android:paddingTop="8dp"
|
android:layout_height="@dimen/material_component_lists_single_line_with_avatar_height"
|
||||||
android:paddingBottom="8dp"
|
android:background="?attr/selectable_list_drawable">
|
||||||
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>
|
Loading…
Reference in New Issue
Block a user