欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android自定義view實(shí)現(xiàn)圓形、圓角和橢圓圖片(BitmapShader圖形渲染)

 更新時(shí)間:2016年08月24日 17:51:19   作者:Jamy Cai  
這篇文章運(yùn)用實(shí)例代碼介紹如何在Android中自定義view,使用BitmapShader圖形渲染方法來(lái)實(shí)現(xiàn)圓形、圓角和橢圓的繪制,有需要的可以參考借鑒。

一、前言

Android實(shí)現(xiàn)圓角矩形,圓形或者橢圓等圖形,一般主要是個(gè)自定義View加上使用Xfermode實(shí)現(xiàn)的。實(shí)現(xiàn)圓角圖片的方法其實(shí)不少,常見(jiàn)的就是利用Xfermode,Shader。本文直接繼承ImageView,使用BitmapShader方法來(lái)實(shí)現(xiàn)圓形、圓角和橢圓的繪制,等大家看我本文的方法后,其他的類似形狀也就都能舉一反三來(lái)來(lái)畫(huà)出來(lái)了。

二、效果圖:

三、BitmapShader簡(jiǎn)介

BitmapShaderShader的子類,可以通過(guò)Paint.setShader(Shader shader)進(jìn)行設(shè)置、

我們這里只關(guān)注BitmapShader,構(gòu)造方法:

mBitmapShader = new BitmapShader(bitmap, TileMode.CLAMP, TileMode.CLAMP);

參數(shù)1:bitmap

參數(shù)2,參數(shù)3:TileMode;

TileMode的取值有三種:

     CLAMP 拉伸

     REPEAT 重復(fù)

     MIRROR 鏡像

如果大家給電腦屏幕設(shè)置屏保的時(shí)候,如果圖片太小,可以選擇重復(fù)、拉伸、鏡像;

重復(fù):就是橫向、縱向不斷重復(fù)這個(gè)bitmap

鏡像:橫向不斷翻轉(zhuǎn)重復(fù),縱向不斷翻轉(zhuǎn)重復(fù);

拉伸:這個(gè)和電腦屏保的模式應(yīng)該有些不同,這個(gè)拉伸的是圖片最后的那一個(gè)像素;橫向的最后一個(gè)橫行像素,不斷的重復(fù),縱項(xiàng)的那一列像素,不斷的重復(fù);

public   BitmapShader(Bitmap bitmap,Shader.TileMode tileX,Shader.TileMode tileY)

調(diào)用這個(gè)方法來(lái)產(chǎn)生一個(gè)畫(huà)有一個(gè)位圖的渲染器(Shader)。

bitmap   在渲染器內(nèi)使用的位圖

tileX      The tiling mode for x to draw the bitmap in.   在位圖上X方向花磚模式

tileY     The tiling mode for y to draw the bitmap in.    在位圖上Y方向花磚模式

TileMode:(一共有三種)

CLAMP  :如果渲染器超出原始邊界范圍,會(huì)復(fù)制范圍內(nèi)邊緣染色。

REPEAT :橫向和縱向的重復(fù)渲染器圖片,平鋪。

MIRROR :橫向和縱向的重復(fù)渲染器圖片,這個(gè)和REPEAT 重復(fù)方式不一樣,他是以鏡像方式平鋪。

四、自定義圓形、圓角和橢圓的圖片View的實(shí)現(xiàn)

1. 測(cè)量View的大小

@Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  // TODO Auto-generated method stub
  super.onMeasure(widthMeasureSpec, heightMeasureSpec);
  // 如果是繪制圓形,則強(qiáng)制寬高大小一致
  if (mType == TYPE_CIRCLE) {
   mWidth = Math.min(getMeasuredWidth(), getMeasuredHeight());
   mRadius = mWidth / 2;
   setMeasuredDimension(mWidth, mWidth);
  }

 }

2、設(shè)置BitmapShader和畫(huà)筆Paint

/**
  * 設(shè)置BitmapShader
  */
 private void setBitmapShader() {
  Drawable drawable = getDrawable();
  if (null == drawable) {
   return;
  }
  Bitmap bitmap = drawableToBitmap(drawable);
  // 將bitmap作為著色器來(lái)創(chuàng)建一個(gè)BitmapShader
  mBitmapShader = new BitmapShader(bitmap, TileMode.CLAMP, TileMode.CLAMP);
  float scale = 1.0f;
  if (mType == TYPE_CIRCLE) {
   // 拿到bitmap寬或高的小值
   int bSize = Math.min(bitmap.getWidth(), bitmap.getHeight());
   scale = mWidth * 1.0f / bSize;

  } else if (mType == TYPE_ROUND || mType == TYPE_OVAL) {
   // 如果圖片的寬或者高與view的寬高不匹配,計(jì)算出需要縮放的比例;縮放后的圖片的寬高,一定要大于我們view的寬高;所以我們這里取大值;
   scale = Math.max(getWidth() * 1.0f / bitmap.getWidth(), getHeight() * 1.0f / bitmap.getHeight());
  }
  // shader的變換矩陣,我們這里主要用于放大或者縮小
  mMatrix.setScale(scale, scale);
  // 設(shè)置變換矩陣
  mBitmapShader.setLocalMatrix(mMatrix);
  mPaint.setShader(mBitmapShader);

 }

3.最后就是繪制出來(lái)圓角、圓形和橢圓的圖片,肯定在onDraw里面啦,根本原理就是使用了上面mBitmapShader渲染的畫(huà)筆來(lái)繪制

@Override
 protected void onDraw(Canvas canvas) {

  if (null == getDrawable()) {
   return;
  }
  setBitmapShader();
  if (mType == TYPE_CIRCLE) {
   canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
  } else if (mType == TYPE_ROUND) {
   mPaint.setColor(Color.RED);
   canvas.drawRoundRect(mRect, mRoundRadius, mRoundRadius, mPaint);
  }else if(mType == TYPE_OVAL){
   canvas.drawOval(mRect, mPaint);
  }
 }

五、視圖布局實(shí)現(xiàn)

這個(gè)很簡(jiǎn)單,就是3個(gè)自定義的view

<ScrollView 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"
 tools:context=".MainActivity" >

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:gravity="center_horizontal"
  android:layout_marginTop="5dp"
  android:layout_marginBottom="25dp"
  android:orientation="vertical" >

  <com.czm.viewdrawtest.XCRoundAndOvalImageView
   android:id="@+id/cicleImageView"
   android:layout_width="200dp"
   android:layout_height="200dp"
   android:src="@drawable/img1" />

  <com.czm.viewdrawtest.XCRoundAndOvalImageView
   android:id="@+id/roundRectImageView"
   android:layout_width="200dp"
   android:layout_height="240dp"
   android:layout_marginTop="5dp"
   android:src="@drawable/img2" />

  <com.czm.viewdrawtest.XCRoundAndOvalImageView
   android:id="@+id/ovalImageView"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_marginTop="5dp"
   android:src="@drawable/img3" />
 </LinearLayout>

</ScrollView>

六、使用和測(cè)試自定義View

上面直接繪制的自定義View寫(xiě)完了,下面就是使用這個(gè)View了,使用方法和普通的ImageView一樣,當(dāng)作普通控件使用即可。

package com.czm.viewdrawtest;


import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
import android.view.WindowManager;
/**
 * 使用自定義ImageView
 * @author caizhiming
 *
 */
public class MainActivity extends Activity {

 private XCRoundAndOvalImageView circleImageView;//圓形圖片
 private XCRoundAndOvalImageView roundRectImageView;//圓角矩形圖片
 private XCRoundAndOvalImageView ovalImageView;//橢圓圖片
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  //設(shè)置無(wú)標(biāo)題 
  requestWindowFeature(Window.FEATURE_NO_TITLE); 
  //設(shè)置全屏 
  getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
    WindowManager.LayoutParams.FLAG_FULLSCREEN); 
  setContentView(R.layout.activity_main);
  
  initViews();
 }
 /**
  * 初始化Views
  */
 private void initViews(){
  circleImageView = (XCRoundAndOvalImageView)findViewById(R.id.cicleImageView);
  roundRectImageView = (XCRoundAndOvalImageView)findViewById(R.id.roundRectImageView);
  ovalImageView = (XCRoundAndOvalImageView)findViewById(R.id.ovalImageView);
  
  roundRectImageView.setType(XCRoundAndOvalImageView.TYPE_ROUND);
  roundRectImageView.setRoundRadius(100);
  
  ovalImageView.setType(XCRoundAndOvalImageView.TYPE_OVAL);
  ovalImageView.setRoundRadius(50);
  
 }
}

七、總結(jié)

以上就是本文的全部?jī)?nèi)容,希望這篇文章的內(nèi)容對(duì)大家開(kāi)發(fā)Android能有所幫助。

相關(guān)文章

最新評(píng)論