如何在 SeekBar 中制作颜色渐变？答案

【问题标题】：How to make a color gradient in a SeekBar?如何在 SeekBar 中制作颜色渐变？
【发布时间】：2011-05-19 13:41:09
【问题描述】：

我想在颜色渐变选择器中使用 SeekBar（即老式 Java Slider）。我见过一些这样的例子，但它们都需要创建新的类等。必须有一种方法来修改或覆盖原始类。或者只是用渐变替换背景。

【问题讨论】：

【解决方案1】：

我知道你是怎么做的。

您在 XML 中创建一个标准搜索栏。

<SeekBar
       android:id="@+id/seekbar_font"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:layout_margin="10px"
       android:layout_below="@id/color_font_text"
       android:max="100"
       android:progress="50"></SeekBar>

然后您通过创建 boxShape 来自定义 onCreate() 中的搜索栏，然后在其中强制使用 LinearGradient。

LinearGradient test = new LinearGradient(0.f, 0.f, 300.f, 0.0f,  

      new int[] { 0xFF000000, 0xFF0000FF, 0xFF00FF00, 0xFF00FFFF,
      0xFFFF0000, 0xFFFF00FF, 0xFFFFFF00, 0xFFFFFFFF}, 
      null, TileMode.CLAMP);
ShapeDrawable shape = new ShapeDrawable(new RectShape());
shape.getPaint().setShader(test);

SeekBar seekBarFont = (SeekBar)findViewById(R.id.seekbar_font);
seekBarFont.setProgressDrawable( (Drawable)shape );

这是SeekBar Color Gradient上方当前代码的图像

【讨论】：

非常感谢这段代码，就像一个魅力。但是你如何选择颜色呢？我能得到的唯一参数是进度，那么，你如何将颜色与进度联系起来？提前致谢！
是的，这是最难的部分。由于渐变在技术上不是线性的，因此您必须编写自己的算法来将选择器的位置与进度条上的实际颜色相关联。
我认为LinearGradient 的x2 参数需要根据搜索栏的宽度进行调整，以使渐变完全填满整个栏。改用GradientDrawable 可以避免这个问题：seekBar.setProgressDrawable(new GradientDrawable(GradientDrawable.Orientation.LEFT_RIGHT, new int[] {startColor, endColor}))

【解决方案2】：

这是对使用 LinearGradient 提供的解决方案的补充。试试这个逻辑，将进度转换为 rgb：

lineColorSeekbar.setMax(256*7-1);
        lineColorSeekbar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                if(fromUser){
                    int r = 0;
                    int g = 0;
                    int b = 0;

                    if(progress < 256){
                        b = progress;
                    } else if(progress < 256*2) {
                        g = progress%256;
                        b = 256 - progress%256;
                    } else if(progress < 256*3) {
                        g = 255;
                        b = progress%256;
                    } else if(progress < 256*4) {
                        r = progress%256;
                        g = 256 - progress%256;
                        b = 256 - progress%256;
                    } else if(progress < 256*5) {
                        r = 255;
                        g = 0;
                        b = progress%256;
                    } else if(progress < 256*6) {
                        r = 255;
                        g = progress%256;
                        b = 256 - progress%256;
                    } else if(progress < 256*7) {
                        r = 255;
                        g = 255;
                        b = progress%256;
                    }

                    lineColorSeekbar.setBackgroundColor(Color.argb(255, r, g, b));
                }
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

            }
        });

【讨论】：

谢谢，效果很好。给定 r、g、b，你如何才能恢复进度？我们有第二个颜色选择器，并希望相应地更新滑块。
String hex = String.format("#%02X%02X%02X", r, g, b);