`

可设置圆角背景边框的按钮, 通过调节色彩明度自动计算按下(pressed)状态颜色

阅读更多
可设置圆角背景边框的的按钮, 通过调节色彩明度自动计算按下(pressed)状态颜色



使用:
xml
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout android:paddingTop="20dp" android:orientation="vertical" android:layout_height="match_parent" android:layout_width="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:android="http://schemas.android.com/apk/res/android">


<LinearLayout android:orientation="horizontal" android:layout_height="wrap_content" android:layout_width="match_parent">

<com.github.czy1121.view.RoundButton app:btnSolidColor="#3F51B5" app:btnPressedRatio="0.8" app:btnCornerRadius="10dp" android:text="Text" style="@style/RoundButton"/>

<com.github.czy1121.view.RoundButton app:btnSolidColor="#9C27B0" app:btnPressedRatio="0.8" app:btnCornerRadius="stadium" android:text="Text" style="@style/RoundButton"/>

<com.github.czy1121.view.RoundButton app:btnSolidColor="#03A9F4" app:btnPressedRatio="0.8" app:btnCornerRadius="stadium" android:text="Text" style="@style/RoundButton"/>

<com.github.czy1121.view.RoundButton app:btnSolidColor="#4CAF50" app:btnPressedRatio="0.9" app:btnCornerRadius="10dp" android:text="Text" style="@style/RoundButton" android:enabled="false"/>

<com.github.czy1121.view.RoundButton android:layout_height="50dp" android:layout_width="50dp" app:btnSolidColor="@color/bg" app:btnPressedRatio="0.9" app:btnCornerRadius="stadium" android:text="Text" style="@style/RoundButton" android:layout_weight="0"/>

</LinearLayout>


<LinearLayout android:orientation="horizontal" android:layout_height="wrap_content" android:layout_width="match_parent" android:background="#CDDC39">

<com.github.czy1121.view.RoundButton app:btnPressedRatio="1.5" app:btnCornerRadius="10dp" android:text="Text" style="@style/RoundButton.Two" app:btnStrokeColor="#3F51B5" android:textColor="#3F51B5"/>

<com.github.czy1121.view.RoundButton app:btnPressedRatio="0.5" app:btnCornerRadius="stadium" android:text="Text" style="@style/RoundButton.Two" app:btnStrokeColor="#9C27B0" android:textColor="#9C27B0" app:btnStrokeDashWidth="6dp" app:btnStrokeDashGap="3dp"/>

<com.github.czy1121.view.RoundButton app:btnPressedRatio="0.9" app:btnCornerRadius="stadium" android:text="Text" style="@style/RoundButton.Two" app:btnStrokeColor="#03A9F4" android:textColor="#03A9F4"/>

<com.github.czy1121.view.RoundButton app:btnPressedRatio="0.9" app:btnCornerRadius="10dp" android:text="Text" style="@style/RoundButton.Two" app:btnStrokeColor="#4CAF50" android:textColor="#4CAF50"/>

</LinearLayout>

</LinearLayout>


import android.content.Context;
import android.content.res.ColorStateList;
import android.content.res.TypedArray;
import android.graphics.Color;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.drawable.GradientDrawable;
import android.util.AttributeSet;
import android.view.Gravity;
import android.widget.TextView;

import com.github.czy1121.roundbutton.R;


public final class RoundButton extends TextView {
    public RoundButton(Context context) {
        this(context, null);
    }

    public RoundButton(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public RoundButton(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);


        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundButton);

        float pressedRatio = a.getFloat(R.styleable.RoundButton_btnPressedRatio, 0.80f);
        int cornerRadius = a.getLayoutDimension(R.styleable.RoundButton_btnCornerRadius, 0);

        ColorStateList solidColor = a.getColorStateList(R.styleable.RoundButton_btnSolidColor);
        int strokeColor = a.getColor(R.styleable.RoundButton_btnStrokeColor, 0x0);
        int strokeWidth = a.getDimensionPixelSize(R.styleable.RoundButton_btnStrokeWidth, 0);
        int strokeDashWidth = a.getDimensionPixelSize(R.styleable.RoundButton_btnStrokeDashWidth, 0);
        int strokeDashGap = a.getDimensionPixelSize(R.styleable.RoundButton_btnStrokeDashGap, 0);

        a.recycle();

        setSingleLine(true);
        setGravity(Gravity.CENTER);

        RoundDrawable rd = new RoundDrawable(cornerRadius == -1);
        rd.setCornerRadius(cornerRadius == -1 ? 0 : cornerRadius);
        rd.setStroke(strokeWidth, strokeColor, strokeDashWidth, strokeDashGap);

        if (solidColor == null) {
            solidColor = ColorStateList.valueOf(0);
        }
        if (solidColor.isStateful()) {
            rd.setSolidColors(solidColor);
        } else if (pressedRatio > 0.0001f) {
            rd.setSolidColors(csl(solidColor.getDefaultColor(), pressedRatio));
        } else {
            rd.setColor(solidColor.getDefaultColor());
        }
        setBackground(rd);
    }

    // 灰度
    int greyer(int color) {
        int blue = (color & 0x000000FF) >> 0;
        int green = (color & 0x0000FF00) >> 8;
        int red = (color & 0x00FF0000) >> 16;
        int grey = Math.round(red * 0.299f + green * 0.587f + blue * 0.114f);
        return Color.argb(0xff, grey, grey, grey);
    }

    // 明度
    int darker(int color, float ratio) {
        color = (color >> 24) == 0 ? 0x22808080 : color;
        float[] hsv = new float[3];
        Color.colorToHSV(color, hsv);
        hsv[2] *= ratio;
        return Color.HSVToColor(color >> 24, hsv);
    }

    ColorStateList csl(int normal, float ratio) {
        //        int disabled = greyer(normal);
        int pressed = darker(normal, ratio);
        int[][] states = new int[][]{{android.R.attr.state_pressed}, {}};
        int[] colors = new int[]{pressed, normal};
        return new ColorStateList(states, colors);
    }

    private static class RoundDrawable extends GradientDrawable {
        private boolean mIsStadium = false;

        private ColorStateList mSolidColors;
        private int mFillColor;

        public RoundDrawable(boolean isStadium) {
            mIsStadium = isStadium;
        }

        public void setSolidColors(ColorStateList colors) {
            mSolidColors = colors;
            setColor(colors.getDefaultColor());
        }

        @Override
        protected void onBoundsChange(Rect bounds) {
            super.onBoundsChange(bounds);
            if (mIsStadium) {
                RectF rect = new RectF(getBounds());
                setCornerRadius((rect.height() > rect.width() ? rect.width() : rect.height()) / 2);
            }
        }

        @Override
        public void setColor(int argb) {
            mFillColor = argb;
            super.setColor(argb);
        }

        @Override
        protected boolean onStateChange(int[] stateSet) {
            if (mSolidColors != null) {
                final int newColor = mSolidColors.getColorForState(stateSet, 0);
                if (mFillColor != newColor) {
                    setColor(newColor);
                    return true;
                }
            }
            return false;
        }

        @Override
        public boolean isStateful() {
            return super.isStateful() || (mSolidColors != null && mSolidColors.isStateful());
        }
    }
}


<declare-styleable name="RoundButton">

<!-- 背景色 -->


<attr name="btnSolidColor" format="color"/>

<!-- 边框色 -->


<attr name="btnStrokeColor" format="color"/>

<!-- 边框厚度 -->


<attr name="btnStrokeWidth" format="dimension"/>

<!-- 边框虚线长度 -->


<attr name="btnStrokeDashWidth" format="dimension"/>

<!-- 边框虚线间隙 -->


<attr name="btnStrokeDashGap" format="dimension"/>

<!-- 圆角半径,stadium 表示半径为 min(height,width) / 2-->



<attr name="btnCornerRadius" format="dimension">

<enum name="stadium" value="-1"/>

</attr>

<!-- 自动计算按下(pressed)状态颜色的系数, 值为0时不自动计算 -->


<attr name="btnPressedRatio" format="float"/>

</declare-styleable>

https://github.com/czy1121/roundbutton
  • 大小: 37.3 KB
分享到:
评论

相关推荐

    Android代码-可设置圆角背景边框的的按钮

    通过调节色彩明度自动计算按下(pressed)状态颜色 Gradle repositories { maven { url "https://jitpack.io" } } dependencies { compile 'com.github.czy1121:roundbutton:1.1.0' } Usage XML 属性 &lt;!-...

    C#圆角按钮

    6. **处理鼠标状态**:根据鼠标是否在按钮上,调整边框颜色和背景色,以实现鼠标悬停和按下效果。 在WPF中,圆角按钮的实现更为灵活,因为WPF提供了数据绑定、样式和模板等高级特性。你可以创建一个新的`User...

    按下后变色的按钮

    2. 创建第二个Shape资源文件(如:pressed_button.xml),定义按钮被按下时的背景颜色: ```xml &lt;solid android:color="@color/button_pressed_color" /&gt; &lt;!-- 按钮按下状态的颜色 --&gt; ...

    改变按钮背景和文字的自定义类

    例如,我们可以设置按钮的背景颜色、边框宽度、圆角半径等。以下是一些示例代码: ```java private void init() { // 设置背景颜色 setBackgroundColor(ContextCompat.getColor(getContext(), R.color.button_...

    android > 按钮Button 按下效果

    总结来说,Android中的按钮按下效果可以通过设置Button的背景资源来实现,这些资源可以是`.9.png`图片或自定义的Shape Drawable。通过对不同状态的资源进行切换,可以达到理想的视觉反馈效果。同时,使用Material ...

    Android圆形按钮

    这样,当用户触摸按钮时,系统会自动应用`circle_button_pressed.xml`定义的新背景,同时`stateListAnimator`可以添加按下的动画效果。 在编程中,我们还可以通过Java或Kotlin代码动态地改变按钮的属性,比如在按钮...

    android中按钮的点击效果

    这是通过`android:background`属性中的状态选择器(State List Drawable)实现的,其中包含了不同状态(如按下、聚焦等)下的背景图片或颜色。 2. **自定义点击效果** 开发者可以通过自定义Drawable资源来改变按钮...

    QT 自定义 button按钮

    button按钮"这个主题,主要涉及的是如何利用QT框架提供的功能,对标准的QPushButton或者更通用的QML Button进行定制,以实现独特的视觉效果,如改变按钮的背景颜色、边框颜色,以及响应用户按下时的状态变化。...

    Qt4透明按钮实现代码

    然而,为了让按钮仍然可点击,我们需要确保它有一个明显的视觉反馈,这通常通过设置鼠标悬停和按下状态的样式来实现。例如: ```cpp styleSheet += "QPushButton:hover {" "border: 1px solid rgba(0, 0, 0, 255);...

    5000多个ANDROID按钮图片

    开发者可以根据自己的需求选择合适的图片,为按钮设置背景,或者通过调整图片尺寸和透明度来适应不同的界面布局。 在Android开发中,按钮通常使用`android.widget.Button`组件创建。开发者可以通过XML布局文件或...

    andorid 美化 扁平按钮美化

    默认情况下,按钮具有一定的立体感,但我们可以通过自定义背景资源来实现扁平化效果。 1. **自定义Shape drawable** 创建一个XML文件(如`button_background.xml`)在`res/drawable`目录下,定义一个Shape元素,...

    自定义QMessageBox样式

    以上样式设置使得QMessageBox的背景为浅灰色,按钮具有圆角和边框,并且在鼠标悬停和按下时有不同的颜色变化。 总结来说,自定义QMessageBox样式涉及以下几个步骤: 1. 创建自定义QMessageBox类,继承自`...

    Button按钮效果

    通过定义不同的Drawable,Selector可以实现按钮在不同状态下的颜色、形状和图片变化,从而达到动态效果。例如,当按钮被按下时,我们可以让它改变背景色或者显示不同的图片。 接着,我们了解一下`Shape`。Shape是...

    SuperButton-这真的可能是最好用的按钮了.zip

    superbutton:1.0.1'Github传送门实现效果基本使用单独设置每个圆角Selector圆形按钮渐变背景的按钮有边框按钮按钮不可点击带图标按钮代码解释0x1 基本使用效果代码  android:layout_width="match_parent"  android...

    Button图片资源

    5. **图片资源**: 压缩包中的“button图片资源”可能包含了不同状态下的按钮图像示例,如正常、按下和聚焦状态的截图,以便于博客读者直观理解效果。 通过以上方法,开发者可以自由定制Button的视觉效果,使其符合...

    爱码哥移动开发平台:button控件

    - **图片按钮**:为按钮设置两个不同的背景图,如正常状态和按下状态,例如: ```html ,btn_pressed.png;width:250;height:30" onclick="hint('图片按钮')"/&gt; ``` - **图标按钮**:当`type="icon"`时,按钮只显示...

    PyQt动态生成自定义风格按钮

    你可以设置按钮的背景色、边框、字体等样式。例如,创建一个带有圆角和渐变背景的按钮: ```python button.setStyleSheet(""" QPushButton { background-color: qlineargradient(x1:0, y1:0, x2:1, y2:1, stop:0...

    android自定义按钮控件样式

    通过在XML中定义选择器,我们可以为按钮的正常状态、按下状态、选中状态等定义不同的背景。 ```xml &lt;item android:drawable="@drawable/button_pressed" android:state_pressed="true"/&gt; ``` 3. **自定义...

    基于qt的程序,演示了如何通过setStyleSheet配置checkbox按钮的外观。

    8. **鼠标按下效果**:`::pressed`伪类可以定义鼠标按下时的样式,例如`QCheckBox::pressed { background-color: #color; }`。 9. **图标**:除了文本,`QCheckBox`还可以显示图标。通过`image`属性,你可以添加一...

    android button 自定义

    - `&lt;item android:state_pressed="true"`表示按钮被按下时的背景。 - `表示按钮被激活(通常在多选或导航场景下)时的背景。 - `&lt;item&gt;`元素通常没有状态属性,作为默认状态的背景。 4. **代码中应用自定义按钮*...

Global site tag (gtag.js) - Google Analytics