Android 简明教程

Android - Image Effects

Android 允许您通过向图像添加不同种类的效果来处理图像。您可以轻松应用图像处理技术，向图像添加某些类型的效果。这些效果可能是亮度、暗度、灰度转换等。

Android allows you to manipulate images by adding different kinds of effects on the images. You can easily apply image processing techniques to add certain kinds of effects on images. The effects could be brightness,darkness, grayscale conversion e.t.c.

Android 提供 Bitmap 类来处理图像。这可以在 android.graphics.bitmap 中找到。您可以通过多种方式对位图进行实例化。我们正在从 imageView 创建图像的位图。

Android provides Bitmap class to handle images. This can be found under android.graphics.bitmap. There are many ways through which you can instantiate bitmap. We are creating a bitmap of image from the imageView.

private Bitmap bmp;
private ImageView img;
img = (ImageView)findViewById(R.id.imageView1);
BitmapDrawable  abmp = (BitmapDrawable)img.getDrawable();

现在，我们将通过调用 BitmapDrawable 类的 getBitmap() 函数来创建位图。其语法如下所示：

Now we will create bitmap by calling getBitmap() function of BitmapDrawable class. Its syntax is given below −

bmp = abmp.getBitmap();

图像不过是二维矩阵。您将以相同的方式处理位图。图像由像素组成。因此，您将从此位图获取像素并对其应用处理。其语法如下所示：

An image is nothing but a two dimensional matrix. Same way you will handle a bitmap. An image consist of pixels. So you will get pixels from this bitmap and apply processing to it. Its syntax is as follows −

for(int i=0; i<bmp.getWidth(); i++){
   for(int j=0; j<bmp.getHeight(); j++){
      int p = bmp.getPixel(i, j);
   }
}

getWidth() 和 getHeight() 函数返回矩阵的高度和宽度。getPixel() 方法返回指定索引处的像素。一旦获得像素，您可以根据需要轻松地对其进行操作。

The getWidth() and getHeight() functions returns the height and width of the matrix. The getPixel() method returns the pixel at the specified index. Once you got the pixel, you can easily manipulate it according to your needs.

除了这些方法之外，还有其他方法可以帮助我们更好地处理图像。

Apart from these methods, there are other methods that helps us manipulate images more better.

Sr.No	Method & description
1	copy(Bitmap.Config config, boolean isMutable) This method copy this bitmap’s pixels into the new bitmap
2	createBitmap(DisplayMetrics display, int width, int height, Bitmap.Config config) Returns a mutable bitmap with the specified width and height
3	createBitmap(int width, int height, Bitmap.Config config) Returns a mutable bitmap with the specified width and height
4	createBitmap(Bitmap src) Returns an immutable bitmap from the source bitmap
5	extractAlpha() Returns a new bitmap that captures the alpha values of the original
6	getConfig() This mehtod eturn that config, otherwise return null
7	getDensity() Returns the density for this bitmap
8	getRowBytes() Return the number of bytes between rows in the bitmap’s pixels
9	setPixel(int x, int y, int color) Write the specified Color into the bitmap (assuming it is mutable) at the x,y coordinate
10	setDensity(int density) This method specifies the density for this bitmap

Example

下面的示例演示了位图上的某些图像效果。它创建了一个基本应用程序，允许您将图片转换为灰度图片等等。

The below example demonstrates some of the image effects on the bitmap. It crates a basic application that allows you to convert the picture into grayscale and much more.

要尝试此示例，您需要在实际设备上运行此示例。

To experiment with this example , you need to run this on an actual device.

Steps	Description
1	You will use Android studio to create an Android application under a package com.example.sairamkrishna.myapplication.
2	Modify src/MainActivity.java file to add necessary code.
3	Modify the res/layout/activity_main to add respective XML components
4	Run the application and choose a running android device and install the application on it and verify the results

下面是已修改的 MainActivity.java 的内容。

Following is the content of the modified MainActivity.java.

package com.example.sairamkrishna.myapplication;

import android.graphics.Bitmap;
import android.graphics.Color;
import android.graphics.drawable.BitmapDrawable;
import android.support.v7.app.ActionBarActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends ActionBarActivity {
   Button b1, b2, b3;
   ImageView im;

   private Bitmap bmp;
   private Bitmap operation;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      b1 = (Button) findViewById(R.id.button);
      b2 = (Button) findViewById(R.id.button2);
      b3 = (Button) findViewById(R.id.button3);
      im = (ImageView) findViewById(R.id.imageView);

      BitmapDrawable abmp = (BitmapDrawable) im.getDrawable();
      bmp = abmp.getBitmap();
   }

   public void gray(View view) {
      operation = Bitmap.createBitmap(bmp.getWidth(),bmp.getHeight(), bmp.getConfig());
      double red = 0.33;
      double green = 0.59;
      double blue = 0.11;

      for (int i = 0; i < bmp.getWidth(); i++) {
         for (int j = 0; j < bmp.getHeight(); j++) {
            int p = bmp.getPixel(i, j);
            int r = Color.red(p);
            int g = Color.green(p);
            int b = Color.blue(p);

            r = (int) red * r;
            g = (int) green * g;
            b = (int) blue * b;
            operation.setPixel(i, j, Color.argb(Color.alpha(p), r, g, b));
         }
      }
      im.setImageBitmap(operation);
   }

   public void bright(View view){
      operation= Bitmap.createBitmap(bmp.getWidth(), bmp.getHeight(),bmp.getConfig());

      for(int i=0; i<bmp.getWidth(); i++){
         for(int j=0; j<bmp.getHeight(); j++){
            int p = bmp.getPixel(i, j);
            int r = Color.red(p);
            int g = Color.green(p);
            int b = Color.blue(p);
            int alpha = Color.alpha(p);

            r = 100  +  r;
            g = 100  + g;
            b = 100  + b;
            alpha = 100 + alpha;
            operation.setPixel(i, j, Color.argb(alpha, r, g, b));
         }
      }
      im.setImageBitmap(operation);
   }

   public void dark(View view){
      operation= Bitmap.createBitmap(bmp.getWidth(),bmp.getHeight(),bmp.getConfig());

      for(int i=0; i<bmp.getWidth(); i++){
         for(int j=0; j<bmp.getHeight(); j++){
            int p = bmp.getPixel(i, j);
            int r = Color.red(p);
            int g = Color.green(p);
            int b = Color.blue(p);
            int alpha = Color.alpha(p);

            r =  r - 50;
            g =  g - 50;
            b =  b - 50;
            alpha = alpha -50;
            operation.setPixel(i, j, Color.argb(Color.alpha(p), r, g, b));
         }
      }
      im.setImageBitmap(operation);
   }

   public void gama(View view) {
      operation = Bitmap.createBitmap(bmp.getWidth(),bmp.getHeight(),bmp.getConfig());

      for(int i=0; i<bmp.getWidth(); i++){
         for(int j=0; j<bmp.getHeight(); j++){
            int p = bmp.getPixel(i, j);
            int r = Color.red(p);
            int g = Color.green(p);
            int b = Color.blue(p);
            int alpha = Color.alpha(p);

            r =  r + 150;
            g =  0;
            b =  0;
            alpha = 0;
            operation.setPixel(i, j, Color.argb(Color.alpha(p), r, g, b));
         }
      }
      im.setImageBitmap(operation);
   }

   public void green(View view){
      operation = Bitmap.createBitmap(bmp.getWidth(),bmp.getHeight(), bmp.getConfig());

      for(int i=0; <bmp.getWidth(); i++){
         for(int j=0; j<bmp.getHeight(); j++){
            int p = bmp.getPixel(i, j);
            int r = Color.red(p);
            int g = Color.green(p);
            int b = Color.blue(p);
            int alpha = Color.alpha(p);

            r =  0;
            g =  g+150;
            b =  0;
            alpha = 0;
            operation.setPixel(i, j, Color.argb(Color.alpha(p), r, g, b));
         }
      }
      im.setImageBitmap(operation);
   }

   public void blue(View view){
      operation = Bitmap.createBitmap(bmp.getWidth(),bmp.getHeight(), bmp.getConfig());

      for(int i=0; i<bmp.getWidth(); i++){
         for(int j=0; j<bmp.getHeight(); j++){
            int p = bmp.getPixel(i, j);
            int r = Color.red(p);
            int g = Color.green(p);
            int b = Color.blue(p);
            int alpha = Color.alpha(p);

            r =  0;
            g =  0;
            b =  b+150;
            alpha = 0;
            operation.setPixel(i, j, Color.argb(Color.alpha(p), r, g, b));
         }
      }
      im.setImageBitmap(operation);
   }
}

以下是修改后的 xml res/layout/activity_main.xml 内容。

Following is the modified content of the xml res/layout/activity_main.xml.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/textView"
      android:layout_alignParentTop="true"
      android:layout_centerHorizontal="true"
      android:textSize="30dp"
      android:text="Image Effects" />

   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Tutorials Point"
      android:id="@+id/textView2"
      android:layout_below="@+id/textView"
      android:layout_centerHorizontal="true"
      android:textSize="35dp"
      android:textColor="#ff16ff01" />

   <ImageView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imageView"
      android:layout_below="@+id/textView2"
      android:layout_centerHorizontal="true"
      android:src="@drawable/abc"/>

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Gray"
      android:onClick="gray"
      android:id="@+id/button"
      android:layout_alignParentBottom="true"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true"
      android:layout_marginBottom="97dp" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="dark"
      android:onClick="dark"
      android:id="@+id/button2"
      android:layout_alignBottom="@+id/button"
      android:layout_alignParentRight="true"
      android:layout_alignParentEnd="true" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Bright"
      android:onClick="bright"
      android:id="@+id/button3"
      android:layout_alignTop="@+id/button2"
      android:layout_centerHorizontal="true" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Red"
      android:onClick="gama"
      android:id="@+id/button4"
      android:layout_below="@+id/button3"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Green"
      android:onClick="green"
      android:id="@+id/button5"
      android:layout_alignTop="@+id/button4"
      android:layout_alignLeft="@+id/button3"
      android:layout_alignStart="@+id/button3" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="blue"
      android:onClick="blue"
      android:id="@+id/button6"
      android:layout_below="@+id/button2"
      android:layout_toRightOf="@+id/textView"
      android:layout_toEndOf="@+id/textView" />

</RelativeLayout>

下面是 AndroidManifest.xml 文件的内容。

Following is the content of AndroidManifest.xml file.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.sairamkrishna.myapplication" >
   <application
      android:allowBackup="true"
      android:icon="@mipmap/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >

      <activity
         android:name=".MainActivity"
         android:label="@string/app_name" >

         <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
         </intent-filter>

      </activity>

   </application>
</manifest>

让我们尝试运行我们刚刚修改的应用程序。我假设你在进行环境设置时已创建了 AVD 。要从 Android Studio 运行该应用程序，请打开一个项目的活动文件，并单击工具栏中的运行图标。Android Studio 会将该应用程序安装在你的 AVD 上并启动它，如果你的设置和应用程序一切正常，它将显示以下模拟器窗口−

Let’s try to run our application we just modified. I assume you had created your AVD while doing environment setup. To run the app from Android studio, open one of your project’s activity files and click Run icon from the toolbar. Android studio installs the app on your AVD and starts it and if everything is fine with your setup and application, it will display following Emulator window −

现在，如果您查看您的设备屏幕，您将看到一个安卓图像以及三个按钮。

Now if you will look at your device screen , you will see the an image of android along with three buttons.

现在，只需选择灰色按钮，它就会将您的图像转换为灰度并更新 UI。如下所示：

Now just select the Gray button that will convert your image into grayscale and will update the UI. It is shown below −

现在轻触亮度按钮，它将为图像的每个像素添加一些值，从而产生一种亮度的错觉。如下所示：

Now tap on the bright button, that will add some value to each pixel of the image and thus makes an illusion of brightness. It is shown below −

现在轻触暗淡按钮，它将从图像的每个像素中减去一些值，从而产生一种暗淡的错觉。如下所示：

Now tap on the dark button, that will subtract some value to each pixel of the image and thus makes an illusion of dark. It is shown below −

现在点击红色按钮，这将会为图像中的每个像素减去一些值，从而产生变暗的错觉。下方显示 −

Now tap on the red button, that will subtract some value to each pixel of the image and thus makes an illusion of dark. It is shown below −

现在点击绿色按钮，这将会为图像中的每个像素减去一些值，从而产生变暗的错觉。下方显示 −

Now tap on the green button, that will subtract some value to each pixel of the image and thus makes an illusion of dark. It is shown below −

现在点击蓝色按钮，这将会为图像中的每个像素减去一些值，从而产生变暗的错觉。下方显示 −

Now tap on the blue button, that will subtract some value to each pixel of the image and thus makes an illusion of dark. It is shown below −