Android custom round corner button view
attrs_round_button_view.xml, the custom attributes for the custom round button view. Create this file in the values resource folder.
colors.xml, default color values.
#3F51B5 #303F9F #FF4081 #e0e9f9 #a8c6f9 #09090a #00ffffff
dimens.xml, default dimension values.
12sp
round_button_view.xml, the layout file for the custom round button view.
RippleDrawableUtil.kt, the utility class for creating ripple effect programatically at runtime.
import android.graphics.drawable.ColorDrawable import android.graphics.drawable.StateListDrawable import android.graphics.drawable.ShapeDrawable import android.graphics.drawable.shapes.RoundRectShape import android.graphics.drawable.Drawable import android.content.res.ColorStateList import android.graphics.drawable.RippleDrawable import android.os.Build import java.util.* object RippleDrawableUtil { fun getAdaptiveRippleDrawable(normalColor: Int, pressedColor: Int, radius : Float = 5.0f): Drawable { return if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { RippleDrawable(ColorStateList.valueOf(pressedColor), null, getRippleMask(normalColor, radius)) } else { getStateListDrawable(normalColor, pressedColor) } } private fun getRippleMask(color: Int, radius : Float = 5.0f): Drawable { val radii = FloatArray(8) Arrays.fill(radii, radius) val r = RoundRectShape(radii, null, null) val shapeDrawable = ShapeDrawable(r) shapeDrawable.paint.color = color return shapeDrawable } fun getStateListDrawable( normalColor: Int, pressedColor: Int): StateListDrawable { val states = StateListDrawable() states.addState(intArrayOf(android.R.attr.state_pressed), ColorDrawable(pressedColor)) states.addState(intArrayOf(android.R.attr.state_focused), ColorDrawable(pressedColor)) states.addState(intArrayOf(android.R.attr.state_activated), ColorDrawable(pressedColor)) states.addState(intArrayOf(), ColorDrawable(normalColor)) return states } }
RoundButtonView.kt, the custom view class for the custom round corner view.
import android.content.Context import android.graphics.Color import android.graphics.drawable.GradientDrawable import android.os.Build import android.support.v4.content.ContextCompat import android.util.AttributeSet import android.util.TypedValue import android.widget.LinearLayout import android.widget.TextView import kotlinx.android.synthetic.main.round_button_view.view.* class RoundButtonView : LinearLayout { constructor(context: Context) : this(context, null) constructor(context: Context, attrs: AttributeSet?) : super(context, attrs) { init(attrs, 0) } constructor(context: Context?, attrs: AttributeSet?, defStyle: Int) : super(context, attrs, defStyle) { init(attrs, defStyle) } private var _bgColor = ContextCompat.getColor(context, R.color.round_button_default_bg_color) private var _borderColor = ContextCompat.getColor(context, R.color.round_button_default_border_color) private var _textColor = ContextCompat.getColor(context, R.color.round_button_default_text_color) private var _textSize = context.resources.getDimensionPixelSize(R.dimen.round_button_default_text_size) private var _text = "" private var _cornerRadius = 1000.0f private var _borderWidth = 2 private val textColorDarkenRatio = 0.7f private lateinit var buttonText: TextView var text: String get() = _text set(value) { _text = value buttonText.text = _text } private fun init(attrs: AttributeSet?, defStyle: Int) { val view = inflate(context, R.layout.round_button_view, this) buttonText = view.tv_button_text val styledAttributes = context.obtainStyledAttributes(attrs, R.styleable.RoundButtonView, defStyle, 0) _bgColor = styledAttributes.getInt(R.styleable.RoundButtonView_bgColor, _bgColor) _borderColor = styledAttributes.getInt(R.styleable.RoundButtonView_borderColor, darkenColor(_bgColor)) _textColor = styledAttributes.getInt(R.styleable.RoundButtonView_textColor, darkenColor(_borderColor)) _cornerRadius = styledAttributes.getFloat(R.styleable.RoundButtonView_cornerRadius, _cornerRadius) _borderWidth = styledAttributes.getInt(R.styleable.RoundButtonView_borderWidth, _borderWidth) _textSize = styledAttributes.getDimensionPixelSize(R.styleable.RoundButtonView_textSize, _textSize) _text = styledAttributes.getString(R.styleable.RoundButtonView_text) ?: "" styledAttributes.recycle() if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { foreground = RippleDrawableUtil.getAdaptiveRippleDrawable(_borderColor, _textColor, _cornerRadius) } buttonText.text = _text buttonText.setTextSize(TypedValue.COMPLEX_UNIT_PX, _textSize.toFloat()) setButtonStyle() } private fun setButtonStyle() { val shape = GradientDrawable() shape.shape = GradientDrawable.RECTANGLE shape.setStroke(_borderWidth, _borderColor) shape.setColor(_bgColor) shape.cornerRadius = _cornerRadius background = shape buttonText.setTextColor(_textColor) } private fun darkenColor(color: Int): Int { val hsv = FloatArray(3) Color.colorToHSV(color, hsv) hsv[2] *= textColorDarkenRatio return Color.HSVToColor(hsv) } }
activity_main.xml, using the custom round corner button view in a layout file.
MainActivity.kt
import android.support.v7.app.AppCompatActivity import android.os.Bundle class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) } }
Search within Codexpedia
Custom Search
Search the entire web
Custom Search
Related Posts