Android版美图秀秀,主要是修改图片的显示效果,修改图片的透明的显示范围,修改图片的红色显示范围,修改图片绿色显示范围,修改图片蓝色显示范围;
想要修改图片的颜色就必须要重新绘制,一想到重新绘制就要想到 画笔 + 画笔🖌️
之前的博客,Android-系统绘图真相,控制图片的旋转,缩放,平移等等,都是操作画布矩阵Matrix对象
如果想要修改图片的颜色显示效果,就是操作画笔🖌️,画笔有可以设置ColorMatrixColorFilter(colorMatrix); ColorMatrix 做了一系列复杂的颜色值ragb运算
修改图片颜色由四个部分组成:简称argb
1.alpha 透明的改变
2.rad 红色改变
3.green 绿色改变
4.blue 蓝色改变
AndroidManifest.xml加入权限:
<!-- 读取外置存储 SD card权限 --> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
具体代码:
package liudeli.my_media1; import android.app.Activity; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.ColorFilter; import android.graphics.ColorMatrix; import android.graphics.ColorMatrixColorFilter; import android.graphics.Matrix; import android.graphics.Paint; import android.os.Bundle; import android.os.Environment; import android.util.Log; import android.widget.ImageView; import android.widget.SeekBar; import android.widget.Toast; import java.io.File; /** * Android 山寨版 美图秀秀 */ public class MeituActivity extends Activity { private final String TAG = MeituActivity.class.getSimpleName(); private ImageView image_view; private SeekBar sb_alpha; private SeekBar sb_rad; private SeekBar sb_green; private SeekBar sb_blue; // 原图 private Bitmap bitmap; private Canvas canvas; private Bitmap newBitmap; // 空白的新图 private Paint paint; private final int SB_MAX = 255; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_meitu); image_view = findViewById(R.id.image_view); sb_alpha = findViewById(R.id.sb_alpha); sb_rad = findViewById(R.id.sb_rad); sb_green = findViewById(R.id.sb_green); sb_blue = findViewById(R.id.sb_blue); /** * 设置拖动条最大值 */ sb_alpha.setMax(SB_MAX); sb_rad.setMax(SB_MAX); sb_green.setMax(SB_MAX); sb_blue.setMax(SB_MAX); sb_alpha.setOnSeekBarChangeListener(seekBarChangeListener); sb_rad.setOnSeekBarChangeListener(seekBarChangeListener); sb_green.setOnSeekBarChangeListener(seekBarChangeListener); sb_blue.setOnSeekBarChangeListener(seekBarChangeListener); /** * 绘制图片的基本流程 * 1.获取原图 * 2.创建一张空白的图片 * 3.指定一张图片 * 4.显示图片:获取画好的空白图片 */ /** * 1.获取原图 */ File file = new File(Environment.getExternalStorageDirectory(), "mm.jpg"); if (!file.exists()) { Toast.makeText(this, file.getName() + "不存在", Toast.LENGTH_SHORT).show(); return; } bitmap = BitmapFactory.decodeFile(file.getAbsolutePath()); image_view.setImageBitmap(bitmap); /** * 2.创建一张空白的图片 * 必须要给一张空白的图片,然后操作图片; * 参数一:空白图片的宽度,就拿原始图片的宽度 * 参数二:空白图片的高度,就拿原始图片的高度 * 参数三:空白图片的配置信息,就拿原始图片的配置信息 */ newBitmap = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), bitmap.getConfig()); // 拿一块新的画布,把空白图片和画布关联 canvas = new Canvas(newBitmap); // 设置画布的背景 canvas.drawColor(Color.WHITE); // 拿一只新的画笔 paint = new Paint(); /** * 3.在指定的图片上操作,必须要指定好在哪张图片上操作; * 参数一:原始的 之前的 bitmap * 参数二:注意:⚠ Matrix集结了非常复杂的高等数学运算,操作图片的 图片缩放/图片旋转/图片平移/等等 都是Matrix来计算运算的 * 参数三:画笔🖌️ */ canvas.drawBitmap(bitmap, new Matrix(), paint); /** * 4.操作图片完成✅后,需要获取结果,操作后的结果就是空白图片 */ image_view.setImageBitmap(newBitmap); } /** * 定义SeekBar监听 */ private final SeekBar.OnSeekBarChangeListener seekBarChangeListener = new SeekBar.OnSeekBarChangeListener() { float alpha = 1; // (0 ~ 1 就是变化的过程) 0就是透明 0.5就是半透明 1就是完全显示 float rad = 1; float green = 1; float blue = 1; /** * 拖动条 拖动过程中,拖动的改变 * @param seekBar * @param progress * @param fromUser */ @Override public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { switch (seekBar.getId()) { case R.id.sb_alpha: alpha = (float) (SB_MAX - progress) / SB_MAX; Log.d(TAG, "progress:" + progress + " alpha:" + alpha); break; case R.id.sb_rad: rad = (float) (SB_MAX - progress) / SB_MAX; break; case R.id.sb_green: green = (float) (SB_MAX - progress) / SB_MAX; break; case R.id.sb_blue: blue = (float) (SB_MAX - progress) / SB_MAX; break; default: break; } /** * ColorMatrix 做了一系列复杂的颜色值ragb运算 * 颜色值ragb运算,颜色矩阵是 5*4 的float数组 */ ColorMatrix colorMatrix = new ColorMatrix(); /** * 以下这些值,是颜色矩阵的内部运算是需要这样的值,是这样排列的 * 0, 0, 0, 0, 0, // 红色 * 0, 0, 0, 0, 0, // 绿色 * 0, 0, 0, 0, 0, // 蓝色 * 0, 0, 0, 0, 0, // 透明的 * * 以下这些值是让图片正常显示,是原图的效果 (0 ~ 1 就是变化的过程) * 1, 0, 0, 0, 0, // 红色 * 0, 1, 0, 0, 0, // 绿色 * 0, 0, 1, 0, 0, // 蓝色 * 0, 0, 0, 1, 0, // 透明的 */ colorMatrix.set(new float[]{ rad, 0, 0, 0, 0, // 红色 0, green, 0, 0, 0, // 绿色 0, 0, blue, 0, 0, // 蓝色 0, 0, 0, alpha, 0, // 透明的 }); /** * 颜色矩阵-颜色过滤器,需要ColorMatrix */ ColorFilter colorFilter = new ColorMatrixColorFilter(colorMatrix); /** * 画笔🖌️需要颜色过滤器 * 给画笔🖌️设置颜色过滤器,就可以绘制好图片的颜色 */ paint.setColorFilter(colorFilter); /** * 【由于画笔🖌️,修改了颜色过滤器-颜色矩阵的颜色运算,所以需要 用画笔🖌️画图片操作】 */ canvas.drawBitmap(bitmap, new Matrix(), paint); /** * 4.操作图片完成✅后,需要获取结果,操作后的结果就是空白图片 */ image_view.setImageBitmap(newBitmap); } /** * 开始拖动 拖动条 * @param seekBar */ @Override public void onStartTrackingTouch(SeekBar seekBar) { } /** * 停止拖动 拖动条 * @param seekBar */ @Override public void onStopTrackingTouch(SeekBar seekBar) { } }; }
布局文件:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="10dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="透明" android:textColor="@android:color/black" android:textSize="20sp" /> <SeekBar android:id="@+id/sb_alpha" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="10dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="红色" android:textColor="@android:color/holo_red_dark" android:textSize="20sp" /> <SeekBar android:id="@+id/sb_rad" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="10dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="绿色" android:textColor="@android:color/holo_green_dark" android:textSize="20sp" /> <SeekBar android:id="@+id/sb_green" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="10dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="蓝色" android:textColor="@android:color/holo_blue_dark" android:textSize="20sp" /> <SeekBar android:id="@+id/sb_blue" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_gravity="center_vertical" /> </LinearLayout> <ImageView android:id="@+id/image_view" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="10dp" /> </LinearLayout>
实现效果:

浙公网安备 33010602011771号