在Android中使用Palette API选择颜色的示例

当我们为任何应用程序进行UI设计时，在构建应用程序时应注意的最重要的部分是，我们应在应用程序中使用适当的颜色组合，有时应与图像的颜色组合相同。使用此API，我们可以根据图像中显示的颜色来更新小部件的颜色。此API将帮助我们从图像中提取颜色，然后可以在小部件中使用这些颜色。

我们将在本文中构建什么?

我们将构建一个简单的应用程序，其中将使用两个不同的图像根据图像文件更改布局UI组件的颜色。下面提供了一个示例视频，以使您对本文中的工作有个大概的了解。注意，我们将使用Java语言实现该项目。

分步实施

步骤1：创建一个新项目

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

步骤2：在build.gradle文件中添加依赖项

导航到Gradle脚本> build.gradle(Module：app)并将以下依赖项添加到“依赖项”部分。

implementation ‘com.android.support:palette-v7:30.3.0’

添加依赖项后，现在同步您的项目，我们将朝着使用布局文件的方向迈进。

步骤3：使用activity_main.xml文件

导航到应用程序> res>布局> activity_main.xml，然后将以下代码添加到该文件中。以下是activity_main.xml文件的代码。

Note: The images used in the ImageView are present in the drawable folder. You can add yours to it. 

步骤4：使用MainActivity。 Java文件

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

Java

import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
  
import androidx.appcompat.app.AppCompatActivity;
import androidx.palette.graphics.Palette;
  
public class MainActivity extends AppCompatActivity {
  
    // creating variables for our UI components..
    private TextView headTV, gfgTV;
    private ImageView gfgIV;
    private Button changeBtn, changeBtn2;
    private RelativeLayout backRL;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // initializing all our variables with their ids.
        headTV = findViewById(R.id.idTVHead);
        gfgTV = findViewById(R.id.idTVGFG);
        gfgIV = findViewById(R.id.idIVImage);
        backRL = findViewById(R.id.idRLBack);
        changeBtn = findViewById(R.id.idBtnChangeImg);
        changeBtn2 = findViewById(R.id.idBtnChangeImg2);
          
        // on below line we are decoding our image from image resource.
        Bitmap bitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.logo1);
        Bitmap bitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.logo2);
          
        // Get bitmap from drawable resources
        // on below line we are calling a method
        // to change the layout color according to first image.
        createPaletteAsync(bitmap1);
          
        // on below line we are setting 
        // bitmap to our image view.
        gfgIV.setImageBitmap(bitmap1);
          
        // on below line we are adding click listener to our button1.
        changeBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                  
                // inside on click we are calling a second method 
                // to change our layout colors with second image bitmaps. .
                createDarkPaletteAsync(bitmap2);
                  
                // on below line we are setting bitmap to our image view.
                gfgIV.setImageBitmap(bitmap2);
            }
        });
          
        // adding on click listener for our second button.
        changeBtn2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                  
                // on below line we are calling a method to change
                // our layout colors and we are passing our first image bitmap.
                createPaletteAsync(bitmap1);
                  
                // on below line we are setting 
                // the bitmap to our image view.
                gfgIV.setImageBitmap(bitmap1);
            }
        });
    }
  
    public void createDarkPaletteAsync(Bitmap bitmap) {
          
        // on below line we are calling a palette 
        // method from bitmap to get colors from our image.
        Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
            public void onGenerated(Palette p) {
                  
                // Use generated instance
                // on below line we are passing
                // a default value to it.
                int defaultValue = 0x000000;
                  
                // on below line we are adding colors to our different views.
                headTV.setTextColor(p.getLightVibrantColor(defaultValue));
                gfgTV.setTextColor(p.getLightVibrantColor(defaultValue));
                backRL.setBackgroundColor(p.getDarkVibrantColor(defaultValue));
                changeBtn.setTextColor(p.getDarkVibrantColor(defaultValue));
                changeBtn.setBackgroundColor(p.getLightVibrantColor(defaultValue));
                changeBtn2.setTextColor(p.getDarkVibrantColor(defaultValue));
                changeBtn2.setBackgroundColor(p.getLightVibrantColor(defaultValue));
            }
        });
    }
  
    public void createPaletteAsync(Bitmap bitmap) {
        // on below line we are calling a palette method
        // from bitmap to get colors from our image.
        Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
            public void onGenerated(Palette p) {
                 
                // Use generated instance
                // on below line we are passing
                // a default value to it.
                int defaultValue = 0x000000;
                  
                // on below line we are adding colors to our different views.
                headTV.setTextColor(p.getDarkVibrantColor(defaultValue));
                gfgTV.setTextColor(p.getDominantColor(defaultValue));
                backRL.setBackgroundColor(p.getLightVibrantColor(defaultValue));
                changeBtn.setTextColor(p.getLightMutedColor(defaultValue));
                changeBtn.setBackgroundColor(p.getDarkVibrantColor(defaultValue));
                changeBtn2.setTextColor(p.getLightMutedColor(defaultValue));
                changeBtn2.setBackgroundColor(p.getDarkVibrantColor(defaultValue));
                  
            }
        });
    }
}

现在运行您的应用程序，并查看该应用程序的输出。

输出：