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>
实现效果: