-
Notifications
You must be signed in to change notification settings - Fork 13
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #150 from natura-cosmeticos/icon-button-component
[DSY-1332] - Icon button component
- Loading branch information
Showing
28 changed files
with
811 additions
and
58 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
15 changes: 15 additions & 0 deletions
15
designsystem/src/main/kotlin/com/natura/android/extensions/TypedValue.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| package com.natura.android.extensions | ||
|
|
||
| import android.util.TypedValue | ||
|
|
||
| /** | ||
| * Get an alpha value converted to base 255. Its in interesting use | ||
| * this method when you want to access a opacity token defined at | ||
| * theme and use it programmatically to set alpha on a component | ||
| * that receives a value between 0 and 255 inclusive, with 0 being | ||
| * transparent and 255 being opaque | ||
| * @return an int with the corresponding alpha value | ||
| */ | ||
| fun TypedValue.getAlphaAsBase255(): Int { | ||
| return (this.float * 255).toInt() | ||
| } |
2 changes: 1 addition & 1 deletion
2
...ain/kotlin/com/natura/android/ext/View.kt → ...lin/com/natura/android/extensions/View.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| package com.natura.android.ext | ||
| package com.natura.android.extensions | ||
|
|
||
| import android.view.View | ||
|
|
||
|
|
||
186 changes: 186 additions & 0 deletions
186
designsystem/src/main/kotlin/com/natura/android/iconButton/IconButton.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,186 @@ | ||
| package com.natura.android.iconButton | ||
|
|
||
| import android.content.Context | ||
| import android.content.res.TypedArray | ||
| import android.util.AttributeSet | ||
| import android.view.View | ||
| import android.widget.ImageView | ||
| import androidx.constraintlayout.widget.ConstraintLayout | ||
| import androidx.core.content.ContextCompat | ||
| import androidx.core.content.res.getIntOrThrow | ||
| import androidx.core.content.res.getResourceIdOrThrow | ||
| import androidx.core.content.res.getStringOrThrow | ||
| import com.natura.android.R | ||
| import com.natura.android.badge.BadgeDrawable | ||
| import com.natura.android.exceptions.MissingThemeException | ||
| import com.natura.android.resources.getColorTokenFromTheme | ||
| import com.natura.android.resources.getIconResourceIdFromName | ||
|
|
||
| class IconButton @JvmOverloads constructor( | ||
| context: Context, | ||
| private val attrs: AttributeSet? = null, | ||
| defStyleAttr: Int = 0 | ||
| ) : ConstraintLayout(context, attrs, defStyleAttr) { | ||
|
|
||
| private var iconButtonAttributesArray: TypedArray | ||
|
|
||
| private var iconColorResourceAttribute = 0 | ||
| private var rippleDrawableResourceAttribute = 0 | ||
|
|
||
| private var iconNameAttribute: String? = null | ||
| private var colorAttribute: Int? = null | ||
| private var notifyAttribute: Int = 0 | ||
| private var enabledAttribute: Boolean = false | ||
|
|
||
| private val iconButton by lazy { findViewById<ImageView>(R.id.iconButtonIcon) } | ||
| private val iconButtonContainer by lazy { findViewById<ConstraintLayout>(R.id.iconButtonContainer) } | ||
| private val badgeContainer by lazy { findViewById<ImageView>(R.id.iconButtonBadgeContainer) } | ||
|
|
||
| init { | ||
| try { | ||
| View.inflate(context, R.layout.icon_button, this) | ||
| } catch (e: Exception) { | ||
| throw (MissingThemeException()) | ||
| } | ||
|
|
||
| iconButtonAttributesArray = context.obtainStyledAttributes(attrs, R.styleable.IconButton) | ||
|
|
||
| getAttributes() | ||
| getAppereanceAttributesFromTheme() | ||
|
|
||
| configureAppearance() | ||
| configureNotification() | ||
| configureEnabled() | ||
|
|
||
| iconButtonAttributesArray.recycle() | ||
| } | ||
|
|
||
| private fun configureEnabled() { | ||
| isEnabled = enabledAttribute | ||
| } | ||
|
|
||
| private fun configureNotification() { | ||
| if (notifyAttribute > 0) { | ||
| badgeContainer.visibility = View.VISIBLE | ||
| BadgeDrawable(context, notifyAttribute, badgeContainer.drawable) | ||
| } | ||
| } | ||
|
|
||
| override fun setEnabled(enabled: Boolean) { | ||
| iconButton.isEnabled = enabled | ||
| if (!enabled) { | ||
| setDisabledColor() | ||
| } | ||
| super.setEnabled(enabled) | ||
| } | ||
|
|
||
| private fun setDisabledColor() { | ||
| iconButton.setColorFilter(getColorTokenFromTheme(context, R.attr.colorMediumEmphasis), android.graphics.PorterDuff.Mode.SRC_IN) | ||
| } | ||
|
|
||
| fun setIcon(icon: String?) { | ||
| icon?.apply { | ||
| val iconDrawableId = getIconResourceIdFromName(context, icon) | ||
| iconButton.setImageResource(iconDrawableId) | ||
| } | ||
| } | ||
|
|
||
| fun getIcon(): ImageView { | ||
| return iconButton | ||
| } | ||
|
|
||
| fun getBadge(): ImageView { | ||
| return badgeContainer | ||
| } | ||
|
|
||
| fun getColor(): Int? { | ||
| return colorAttribute | ||
| } | ||
|
|
||
| private fun getAttributes() { | ||
| getIconName() | ||
| getColorAttribute() | ||
| getEnabledAttribute() | ||
| getNotify() | ||
| } | ||
|
|
||
| private fun getNotify() { | ||
| notifyAttribute = iconButtonAttributesArray.getInteger(R.styleable.IconButton_notify, 0) | ||
| } | ||
|
|
||
| private fun getIconName() { | ||
| try { | ||
| iconNameAttribute = iconButtonAttributesArray.getStringOrThrow(R.styleable.IconButton_iconName) | ||
| } catch (e: Exception) { | ||
| throw (IllegalArgumentException("⚠️ ⚠️ Missing iconName required argument. You MUST set the icon name.", e)) | ||
| } | ||
| } | ||
|
|
||
| private fun getColorAttribute() { | ||
| try { | ||
| colorAttribute = iconButtonAttributesArray.getIntOrThrow(R.styleable.IconButton_buttonColor) | ||
| } catch (e: Exception) { | ||
| throw (IllegalArgumentException("⚠️ ⚠️ Missing iconButton required argument. You MUST set the iconButton color.", e)) | ||
| } | ||
| } | ||
|
|
||
| private fun getEnabledAttribute() { | ||
| enabledAttribute = iconButtonAttributesArray.getBoolean(R.styleable.IconButton_android_enabled, true) | ||
| } | ||
|
|
||
| private fun getAppereanceAttributesFromTheme() { | ||
| try { | ||
| when (colorAttribute) { | ||
| PRIMARY -> { | ||
| setColorAttribute(R.attr.iconButtonPrimary) | ||
| setDrawableRippleAttribute(R.attr.iconButtonPrimary) | ||
| } | ||
| DEFAULT -> { | ||
| setColorAttribute(R.attr.iconButtonDefault) | ||
| setDrawableRippleAttribute(R.attr.iconButtonDefault) | ||
| } | ||
| } | ||
| } catch (e: Exception) { | ||
| throw (MissingThemeException()) | ||
| } | ||
| } | ||
|
|
||
| private fun setDrawableRippleAttribute(iconButtonStyleFromTheme: Int) { | ||
| context | ||
| .theme | ||
| .obtainStyledAttributes( | ||
| attrs, | ||
| R.styleable.IconButton, | ||
| iconButtonStyleFromTheme, | ||
| 0 | ||
| ) | ||
| .apply { | ||
| rippleDrawableResourceAttribute = this.getResourceIdOrThrow(R.styleable.IconButton_rippleDrawable) | ||
| } | ||
| } | ||
|
|
||
| private fun setColorAttribute(attribute: Int) { | ||
| context | ||
| .theme | ||
| .obtainStyledAttributes( | ||
| attrs, | ||
| R.styleable.IconButton, | ||
| attribute, | ||
| 0 | ||
| ) | ||
| .apply { | ||
| iconColorResourceAttribute = this.getResourceIdOrThrow(R.styleable.IconButton_iconColor) | ||
| } | ||
| } | ||
|
|
||
| private fun configureAppearance() { | ||
| setIcon(iconNameAttribute) | ||
| iconButton.setColorFilter(ContextCompat.getColor(context, iconColorResourceAttribute), android.graphics.PorterDuff.Mode.SRC_IN) | ||
| iconButtonContainer.background = resources.getDrawable(rippleDrawableResourceAttribute, context.theme) | ||
| } | ||
|
|
||
| companion object { | ||
| const val DEFAULT = 0 | ||
| const val PRIMARY = 1 | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
18 changes: 18 additions & 0 deletions
18
designsystem/src/main/kotlin/com/natura/android/resources/Resources.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| package com.natura.android.resources | ||
|
|
||
| import android.content.Context | ||
| import com.natura.android.R | ||
| import com.natura.android.resources.ResourcesConstants.DRAWABLE_NOT_FOUND | ||
|
|
||
| fun getIconResourceIdFromName(context: Context, iconName: String): Int { | ||
| var drawableId = context.resources.getIdentifier(iconName.replace("-", "_"), "drawable", context.packageName) | ||
|
|
||
| if (drawableId == DRAWABLE_NOT_FOUND) { | ||
| drawableId = R.drawable.default_icon_outlined_default_mockup | ||
| } | ||
| return drawableId | ||
| } | ||
|
|
||
| object ResourcesConstants { | ||
| const val DRAWABLE_NOT_FOUND = 0 | ||
| } |
16 changes: 16 additions & 0 deletions
16
designsystem/src/main/kotlin/com/natura/android/resources/Theme.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| package com.natura.android.resources | ||
|
|
||
| import android.content.Context | ||
| import android.util.TypedValue | ||
|
|
||
| fun getColorTokenFromTheme(context: Context, attrColorId: Int): Int { | ||
| val value = TypedValue() | ||
| context.theme.resolveAttribute(attrColorId, value, true) | ||
| return value.data | ||
| } | ||
|
|
||
| fun getDimenFromTheme(context: Context, attributeName: Int): Float { | ||
| val typedValue = TypedValue() | ||
| context.theme.resolveAttribute(attributeName, typedValue, true) | ||
| return typedValue.getDimension(context.resources.displayMetrics) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
9 changes: 9 additions & 0 deletions
9
designsystem/src/main/res/drawable/default_icon_outlined_navigation_arrowleft.xml
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| <vector xmlns:android="http://schemas.android.com/apk/res/android" | ||
| android:width="24dp" | ||
| android:height="24dp" | ||
| android:viewportWidth="24" | ||
| android:viewportHeight="24"> | ||
| <path | ||
| android:fillColor="#FF000000" | ||
| android:pathData="M9.65 17.25A0.46 0.46 0 0 1 9.3 17.1a0.48 0.48 0 0 1 0-0.7l4.35-4.41l-4.35-4.4A0.5 0.5 0 1 1 10 6.9l4.72 4.72c0.09 0.1 0.14 0.22 0.14 0.35a0.64 0.64 0 0 1-0.14 0.4L10 17.09a0.48 0.48 0 0 1-0.35 0.17z"/> | ||
| </vector> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 6 additions & 0 deletions
6
designsystem/src/main/res/drawable/icon_button_base_badge.xml
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| <?xml version="1.0" encoding="utf-8"?> | ||
| <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> | ||
| <item | ||
| android:id="@+id/badge_placeholder" | ||
| android:drawable="@android:color/transparent" /> | ||
| </layer-list> |
12 changes: 12 additions & 0 deletions
12
designsystem/src/main/res/drawable/iconbutton_ripple_background_default.xml
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| <?xml version="1.0" encoding="utf-8"?> | ||
| <ripple | ||
| xmlns:android="http://schemas.android.com/apk/res/android" | ||
| android:color="?attr/colorHighlightOpacity05"> | ||
| <item | ||
| android:id="@android:id/mask" | ||
| android:gravity="center"> | ||
| <shape android:shape="oval"> | ||
| <solid android:color="@android:color/white"/> | ||
| </shape> | ||
| </item> | ||
| </ripple> |
Oops, something went wrong.