如何在Android中创建基本的颜色选择器工具？

有许多用于Android应用程序的开源颜色选择器工具可供选择。在本文的讨论中，在本文的最后，我们将能够在android应用程序中实现颜色选择器工具，请查看以下图片以对讨论进行概述。在本文中，已经讨论了实现非常基本的颜色选择器工具。

下面的样本GIF给出得到什么我们将在本文中做的想法。注意，我们将使用Java语言实现该项目。

实施颜色选择器工具的步骤

步骤1：创建一个新项目

• 要在Android Studio中创建新项目，请参阅如何在Android Studio中创建/启动新项目。
• 请注意，选择Java作为编程语言。

步骤2：添加AmbilWarna颜色选择器库依赖项

• AmbilWarna是一个开源颜色选择器库，可以在这里找到。其中只有一个版本，这是最终版本之一。
• 现在将其依赖项添加到应用程序级别的gradle文件中。

implementation ‘com.github.yukuku:ambilwarna:2.0.1’

• 确保系统应连接到网络(以便下载所需的文件)，并在调用依赖项后，单击“立即同步”按钮。
• 请参考下图，找到应用程序级gradle文件并调用依赖项。

步骤3：使用actvity_main.xml文件

• 接下来，转到activity_main.xml文件，该文件代表项目的UI。
• 以下是activity_main.xml文件的代码。在代码内部添加了注释，以更详细地了解代码。

输出界面：

在处理颜色选择器工具对话框功能之前，必须了解对话框的各个部分，以便在使用Java代码处理对话框的各个部分时可以变得更加容易。

步骤4：使用MainActivity。 Java文件

• 最后，转到MainActivity。 Java文件，并参考以下代码。
• 下面是MainActivity的代码。 Java文件。在代码内部添加了注释，以更详细地了解代码。

Java

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import androidx.appcompat.app.AppCompatActivity;
import yuku.ambilwarna.AmbilWarnaDialog;
  
public class MainActivity extends AppCompatActivity {
  
    // text view variable to set the color for GFG text
    private TextView gfgTextView;
  
    // two buttons to open color picker dialog and one to
    // set the color for GFG text
    private Button mSetColorButton, mPickColorButton;
  
    // view box to preview the selected color
    private View mColorPreview;
  
    // this is the default color of the preview box
    private int mDefaultColor;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        // register the GFG text with appropriate ID
        gfgTextView = findViewById(R.id.gfg_heading);
  
        // register two of the buttons with their
        // appropriate IDs
        mPickColorButton = findViewById(R.id.pick_color_button);
        mSetColorButton = findViewById(R.id.set_color_button);
  
        // and also register the view which shows the
        // preview of the color chosen by the user
        mColorPreview = findViewById(R.id.preview_selected_color);
  
        // set the default color to 0 as it is black
        mDefaultColor = 0;
  
        // button open the AmbilWanra color picker dialog.
        mPickColorButton.setOnClickListener(
                new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        // to make code look cleaner the color
                        // picker dialog functionality are
                        // handled in openColorPickerDialogue()
                        // function
                        openColorPickerDialogue();
                    }
                });
  
        // button to set the color GFG text
        mSetColorButton.setOnClickListener(
                new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        // as the mDefaultColor is the global
                        // variable its value will be changed as
                        // soon as ok button is clicked from the
                        // color picker dialog.
                        gfgTextView.setTextColor(mDefaultColor);
                    }
                });
    }
  
    // the dialog functionality is handled separately
    // using openColorPickerDialog this is triggered as
    // soon as the user clicks on the Pick Color button And
    // the AmbilWarnaDialog has 2 methods to be overridden
    // those are onCancel and onOk which handle the "Cancel"
    // and "OK" button of color picker dialog
    public void openColorPickerDialogue() {
  
        // the AmbilWarnaDialog callback needs 3 parameters
        // one is the context, second is default color,
        final AmbilWarnaDialog colorPickerDialogue = new AmbilWarnaDialog(this, mDefaultColor,
                new AmbilWarnaDialog.OnAmbilWarnaListener() {
                    @Override
                    public void onCancel(AmbilWarnaDialog dialog) {
                        // leave this function body as
                        // blank, as the dialog
                        // automatically closes when
                        // clicked on cancel button
                    }
  
                    @Override
                    public void onOk(AmbilWarnaDialog dialog, int color) {
                        // change the mDefaultColor to
                        // change the GFG text color as
                        // it is returned when the OK
                        // button is clicked from the
                        // color picker dialog
                        mDefaultColor = color;
  
                        // now change the picked color
                        // preview box to mDefaultColor
                        mColorPreview.setBackgroundColor(mDefaultColor);
                    }
                });
        colorPickerDialogue.show();
    }
}

输出：在模拟器上运行

想要一个节奏更快，更具竞争性的环境来学习Android的基础知识吗?

单击此处，前往由我们的专家精心策划的指南，以使您立即做好行业准备！