Android簡單實現畫圖功能_Android

來源:互聯網
上載者:User

如何在圖片上畫畫呢?這裡寫了一個demo,供大家參考
一、先看一眼工程結構
工程結構:

二、自訂view
這個自訂view實現了保留軌跡的功能,代碼如下

package picturegame.view;  import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Paint.Style; import android.util.AttributeSet; import android.view.MotionEvent; import android.view.View; import com.winton.picturegame.R;  public class GameView extends View{      private Paint paint = null; //      private Bitmap originalBitmap = null;//原始圖      private Bitmap new1Bitmap = null;      private Bitmap new2Bitmap = null;      private float clickX =0;      private float clickY=0;      private float startX=0;      private float startY=0;      private boolean isMove = true;      private boolean isClear = false;      private int color =Color.RED;//預設畫筆顏色為紅色      private float strokeWidth =2.0f;//預設畫筆粗度          public GameView(Context context) {     this(context,null);     // TODO Auto-generated constructor stub   }   public GameView(Context context,AttributeSet atts) {     this(context,atts,0);     // TODO Auto-generated constructor stub   }   public GameView(Context context,AttributeSet atts,int defStyle) {     super(context,atts,defStyle);     // TODO Auto-generated constructor stub          originalBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.default_pic).copy(Bitmap.Config.ARGB_8888, true);//載入一張背景     new1Bitmap=originalBitmap.createBitmap(originalBitmap);   }    //清除函數   public void clear(){     isClear =true;     new2Bitmap=originalBitmap.createBitmap(originalBitmap);     invalidate();//重載   }      public void setStrokeWidth(float width){     this.strokeWidth=width;     initPaint();   }   @Override   protected void onDraw(Canvas canvas) {     // TODO Auto-generated method stub     super.onDraw(canvas);     canvas.drawBitmap(writer(new1Bitmap),0,0, null);        }      @Override   public boolean onTouchEvent(MotionEvent event) {     // TODO Auto-generated method stub               clickX =event.getX();          clickY=event.getY();          if(event.getAction()==MotionEvent.ACTION_DOWN){       isMove =false;       invalidate();       return true;     }     else if(event.getAction()==MotionEvent.ACTION_MOVE){       isMove =true;       invalidate();       return true;     }               return super.onTouchEvent(event);   }      /**   * @Title: writer   * @Description: TODO(產生bitmap)   * @param @param pic   * @param @return  設定檔案   * @return Bitmap  傳回型別   * @throws   */   public Bitmap writer(Bitmap pic){     initPaint();          Canvas canvas =null;     if(isClear){       canvas=new Canvas(new2Bitmap);     }else{       canvas=new Canvas(pic);     }          if(isMove){       canvas.drawLine(startX, startY, clickX, clickY, paint);//劃線     }     startX = clickX;          startY =clickY;     if(isClear){       return new2Bitmap;     }     return pic;   }      private void initPaint(){          paint = new Paint();//建立畫筆          paint.setStyle(Style.STROKE);//設定為畫線          paint.setAntiAlias(true);//可以讓線條圓滑一些          paint.setColor(color);//設定畫筆顏色          paint.setStrokeWidth(strokeWidth);//設定畫筆線條的粗細   }      /**   * @Title: setColor   * @Description: TODO(設定線條顏色的對外介面)   * @param @param color  設定檔案   * @return void  傳回型別   * @throws   */   public void setColor(int color){          this.color=color;     initPaint();   }       } 


三、首頁面布局檔案
首頁面布局檔案

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"   android:layout_width="fill_parent"   android:layout_height="fill_parent"   android:gravity="center_horizontal"   android:orientation="vertical" >      <LinearLayout      android:layout_width="match_parent"     android:layout_height="50dp"      android:orientation="horizontal"        >     <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_30"         android:layout_width="30dp"         android:layout_height="30dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>         <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_25"         android:layout_width="25dp"         android:layout_height="25dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>          <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_20"         android:layout_width="20dp"         android:layout_height="20dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>          <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_15"         android:layout_width="15dp"         android:layout_height="15dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>           <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_10"         android:layout_width="10dp"         android:layout_height="10dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>     <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_5"         android:layout_width="5dp"         android:layout_height="5dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>           <LinearLayout        android:layout_width="0dp"       android:layout_height="match_parent"       android:layout_weight="1"       android:gravity="center"       >       <TextView          android:id="@+id/tv_2"         android:layout_width="2dp"         android:layout_height="2dp"         android:background="@drawable/bg_notifaction"         />     </LinearLayout>   </LinearLayout>      <picturegame.view.GameView      android:layout_width="match_parent"     android:layout_height="300dp"     android:id="@+id/gameview"     />                <Button      android:layout_width="200dp"     android:layout_height="80dp"     android:text="clear"     android:textColor="@color/black"     android:id="@+id/btn_clear"          />  </LinearLayout> 

四、主Activity代碼

package com.winton.picturegame;  import picturegame.view.GameView; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; import android.widget.TextView;  import com.winton.basemodule.BaseActivity;  public class MainActivity extends BaseActivity implements OnClickListener {    private GameView gameview = null;   private Button clear = null;      private TextView tv30,tv25,tv20,tv15,tv10,tv5,tv2;    @Override   protected void onCreate(Bundle savedInstanceState) {     // TODO Auto-generated method stub     super.onCreate(savedInstanceState);   }    @Override   public void initView() {     // TODO Auto-generated method stub     setContentView(R.layout.activity_main);          gameview=(GameView)findViewById(R.id.gameview);     clear =(Button)findViewById(R.id.btn_clear);     tv30=(TextView)findViewById(R.id.tv_30);     tv25=(TextView)findViewById(R.id.tv_25);     tv20=(TextView)findViewById(R.id.tv_20);     tv15=(TextView)findViewById(R.id.tv_15);     tv10=(TextView)findViewById(R.id.tv_10);     tv5=(TextView)findViewById(R.id.tv_5);     tv2=(TextView)findViewById(R.id.tv_2);   }    @Override   public void initListener() {     // TODO Auto-generated method stub     clear.setOnClickListener(this);     tv30.setOnClickListener(this);     tv25.setOnClickListener(this);     tv20.setOnClickListener(this);     tv15.setOnClickListener(this);     tv10.setOnClickListener(this);     tv5.setOnClickListener(this);     tv2.setOnClickListener(this);        }    @Override   public void initData() {     // TODO Auto-generated method stub        }   @Override   public void onClick(View v) {     // TODO Auto-generated method stub     if(v==clear){       gameview.clear();       return;     }     if(v==tv30){       gameview.setStrokeWidth(30f);       return;     }     if(v==tv25){       gameview.setStrokeWidth(25f);       return;     }     if(v==tv20){       gameview.setStrokeWidth(20f);       return;     }     if(v==tv15){       gameview.setStrokeWidth(15f);       return;     }     if(v==tv10){       gameview.setStrokeWidth(10f);       return;     }     if(v==tv5){       gameview.setStrokeWidth(5f);       return;     }     if(v==tv2){       gameview.setStrokeWidth(2f);       return;     }        }     } 

五、效果
運行效果圖如下

六、疑問
當線條變粗時,線條會出現如上圖中不連續的問題。請問高手這個怎麼處理呢?我猜測應該要運行演算法,但還不知道怎麼運行。

文章就為大家介紹到這,其實還有許多知識點小編也不是很清楚,希望大家可以進行補充擴充,共同進步。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.