最近較流行的效果 Android自定義View實(shí)現(xiàn)傾斜列表/圖片
先看看效果圖:

實(shí)現(xiàn)思路:擦除圖片相應(yīng)的角,然后層疊圖片,產(chǎn)生傾斜效果
代碼實(shí)現(xiàn):
1、定義屬性
在values文件夾下的attrs文件添加以下代碼
<resources>
<declare-styleable name="TiltView">
<attr name="type" format="integer" />
</declare-styleable>
</resources>
2、自定義布局
public class TiltView extends ImageView {
private int imageWidth;//圖片寬度
private int imageHeight;//圖片高度
private double angle = 10 * Math.PI / 180;//三角形角度
private int triangleHeight;//三角形高度
private Paint paint;//畫(huà)筆
private Path path;//繪制路徑
private int type;//傾斜圖片的類(lèi)型
public TiltView(Context context) {
this(context, null);
}
public TiltView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public TiltView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.TiltView);
type = array.getInteger(R.styleable.TiltView_type, 1);
array.recycle();
}
//重測(cè)大小
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
imageWidth = measureSpec(widthMeasureSpec);
imageHeight = measureSpec(heightMeasureSpec);
setMeasuredDimension(imageWidth, imageHeight); //設(shè)置View的大小
triangleHeight = (int) (Math.abs(Math.tan(angle) * imageHeight));
}
//測(cè)量長(zhǎng)度
private int measureSpec(int measureSpec) {
int minLength = 200;
int mode = MeasureSpec.getMode(measureSpec);
int length = MeasureSpec.getSize(measureSpec);
if (mode == MeasureSpec.AT_MOST) {
length = Math.min(length, minLength);
}
return length;
}
@Override
protected void onDraw(Canvas canvas) {
initPaint();
Bitmap mBitmap = Bitmap.createBitmap(imageWidth, imageHeight, Bitmap.Config.ARGB_8888); //初始化Bitmap
Canvas mCanvas = new Canvas(mBitmap);//創(chuàng)建畫(huà)布,并繪制mBitmap
Bitmap mBackBitmap = ((BitmapDrawable) getDrawable()).getBitmap();
mCanvas.drawBitmap(resizeBitmap(mBackBitmap), 0, 0, null);//繪制Bitmap
setTriangle();
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));
mCanvas.drawPath(path, paint);
canvas.drawBitmap(mBitmap, 0, 0, null);
}
//初始化畫(huà)筆
private void initPaint() {
paint = new Paint();
paint.setDither(true);//設(shè)定是否使用圖像抖動(dòng)處理,會(huì)使繪制出來(lái)的圖片顏色更加平滑和飽滿,圖像更加清晰
paint.setAntiAlias(true);//設(shè)置抗鋸齒
paint.setStrokeWidth(5);
paint.setStyle(Paint.Style.FILL);
paint.setStrokeCap(Paint.Cap.ROUND);
paint.setStrokeJoin(Paint.Join.ROUND);//圓角
}
//設(shè)置三角形區(qū)域
private void setTriangle() {
path = new Path();
switch (type) {
case 1://右下角
path.moveTo(0, imageHeight);
path.lineTo(imageWidth, imageHeight);
path.lineTo(imageWidth, imageHeight - triangleHeight);
path.lineTo(0, imageHeight);
break;
case 2://左上角+左下角
path.moveTo(0, triangleHeight);
path.lineTo(imageWidth, 0);
path.lineTo(0, 0);
path.lineTo(0, imageHeight);
path.lineTo(imageWidth, imageHeight);
path.lineTo(0, imageHeight - triangleHeight);
break;
case 3://右上角+右下角
path.moveTo(imageWidth, triangleHeight);
path.lineTo(0, 0);
path.lineTo(imageWidth, 0);
path.lineTo(imageWidth, imageHeight);
path.lineTo(0, imageHeight);
path.lineTo(imageWidth, imageHeight - triangleHeight);
break;
case 4://右上角
path.moveTo(0, 0);
path.lineTo(imageWidth, 0);
path.lineTo(imageWidth, triangleHeight);
path.lineTo(0, 0);
break;
case 5://左上角
path.moveTo(0, 0);
path.lineTo(imageWidth, 0);
path.lineTo(0, triangleHeight);
path.lineTo(0, 0);
break;
}
}
//重新調(diào)節(jié)圖片大小
private Bitmap resizeBitmap(Bitmap bitmap) {
int width = bitmap.getWidth();
int height = bitmap.getHeight();
// 設(shè)置想要的大小
int newWidth = imageWidth;
int newHeight = imageHeight;
// 計(jì)算縮放比例
float scaleWidth = ((float) newWidth) / width;
float scaleHeight = ((float) newHeight) / height;
// 取得想要縮放的matrix參數(shù)
Matrix matrix = new Matrix();
matrix.postScale(scaleWidth, scaleHeight);
// 得到新的圖片
return Bitmap.createBitmap(bitmap, 0, 0, width, height, matrix, true);
}
}
3、布局代碼調(diào)用
//其中android:layout_marginTop="-15dp"對(duì)效果實(shí)現(xiàn)有很大的作用
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.pengkv.may.widget.TiltView
android:layout_width="match_parent"
android:layout_height="100dp"
android:src="@drawable/sample_0"
app:type="1" />
<com.pengkv.may.widget.TiltView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="-15dp"
android:src="@drawable/sample_1"
app:type="2" />
<com.pengkv.may.widget.TiltView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="-15dp"
android:src="@drawable/sample_2"
app:type="4" />
</LinearLayout>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
android自定義控件實(shí)現(xiàn)簡(jiǎn)易時(shí)間軸(1)
這篇文章主要為大家詳細(xì)介紹了android自定義控件實(shí)現(xiàn)簡(jiǎn)易時(shí)間軸,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-01-01
基于Android6.0實(shí)現(xiàn)彈出Window提示框
這篇文章主要為大家詳細(xì)介紹了基于Android6.0實(shí)現(xiàn)彈出Window提示框,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10
Android手機(jī)獲取root權(quán)限并實(shí)現(xiàn)關(guān)機(jī)重啟功能的方法
這篇文章主要介紹了Android手機(jī)獲取root權(quán)限并實(shí)現(xiàn)關(guān)機(jī)重啟功能的方法,是Android程序設(shè)計(jì)中非常重要的技巧,需要的朋友可以參考下2014-08-08
Android 邊播邊緩存的實(shí)現(xiàn)(MP4 未加密m3u8)
這篇文章主要介紹了Android 邊播邊緩存的實(shí)現(xiàn)(MP4 未加密m3u8),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11
android實(shí)現(xiàn)用戶(hù)體驗(yàn)超棒的微信WebView進(jìn)度條
本篇文章主要介紹了android實(shí)現(xiàn)用戶(hù)體驗(yàn)超棒的微信WebView進(jìn)度條,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-03-03
詳解Android數(shù)據(jù)存儲(chǔ)之SQLCipher數(shù)據(jù)庫(kù)加密
對(duì)于已經(jīng)ROOT的手機(jī)來(lái)說(shuō)的沒(méi)有任何安全性可以,一旦被利用將會(huì)導(dǎo)致數(shù)據(jù)庫(kù)數(shù)據(jù)的泄漏,本篇文章主要介紹了Android數(shù)據(jù)存儲(chǔ)之SQLCipher數(shù)據(jù)庫(kù)加密,具有一定的參考價(jià)值,有需要的可以了解一下。2016-12-12
Android開(kāi)發(fā)之全屏與非全屏的切換設(shè)置方法小結(jié)
這篇文章主要介紹了Android開(kāi)發(fā)之全屏與非全屏的切換設(shè)置方法,結(jié)合實(shí)例形式分析了Android全屏切換靜態(tài)與動(dòng)態(tài)兩種實(shí)現(xiàn)方法,需要的朋友可以參考下2017-08-08
Android開(kāi)發(fā)基礎(chǔ)實(shí)現(xiàn)最簡(jiǎn)單的視頻播放示例
這篇文章主要為大家介紹了Android開(kāi)發(fā)基礎(chǔ)實(shí)現(xiàn)最簡(jiǎn)單的視頻播放示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-02-02

