文档章节

Android进阶学习-实现卡券效果

August1996_
 August1996_
发布于 2016/05/22 10:48
字数 557
阅读 41
收藏 0

#程序员薪资揭榜#你做程序员几年了?月薪多少?发量还在么?>>>

之前看了一个类似的博客,想来自己实现一下,嘿嘿,贴一下效果图:

 

先说一下原理,卡券的实现是拓展了LinearLayout的,然后凹凸的效果是通过画圆的方式来画出来的,只要控制位置,就能够画出半圆的效果.下面我们看编码:

1.attrs属性文件:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="CustomContainer">
        <attr name="mColor" format="color" />
        <attr name="mGap" format="dimension" />
        <attr name="mHalfRadius" format="dimension" />
    </declare-styleable>

</resources>

2.CustomContainer.java文件:

package com.example.customview;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.widget.LinearLayout;

public class CustomContainer extends LinearLayout {
	
	private int		mRadius;
	private int		mGap;
	private int		mColor;
	private Paint	mPaint;
					
	public CustomContainer(Context context) {
		this(context, null);
	}
	
	public CustomContainer(Context context, AttributeSet attrs) {
		this(context, attrs, 0);
	}
	
	public CustomContainer(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		
		TypedArray ta = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CustomContainer, defStyleAttr, 0);
		
		int n = ta.getIndexCount();
		
		for (int i = 0; i < n; i++) {
			int attr = ta.getIndex(i);
			switch (attr) {
				case R.styleable.CustomContainer_mColor:
					mColor = ta.getColor(attr, Color.TRANSPARENT);
					break;
				case R.styleable.CustomContainer_mGap:
					mGap = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, ta.getDimension(attr, 3),
							getResources().getDisplayMetrics());
					break;
				case R.styleable.CustomContainer_mHalfRadius:
					mRadius = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, ta.getDimension(attr, 20),
							getResources().getDisplayMetrics());
					break;
					
				default:
					break;
			}
		}
		
		ta.recycle();
		/**
		 * 上面是初始化属性参数...不想说啦!!!
		 */
		
		mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
		mPaint.setStyle(Paint.Style.FILL);
		mPaint.setColor(mColor);
		/**
		 * 初始化画笔
		 */
	}
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		
		/**
		 * 下面就是计算啦,没有意外的话,博客会给一张图来解析的
		 */
		
		int n = (mGap + getWidth()) / (2 * mRadius + mGap);
		/**
		 * 2*mRadius*n+(n-1)*mGap=geiWidth()转化而来
		 */
		
		int centerTopY = 0;
		int centerBottomY = getHeight();
		
		for (int i = 0; i < n; i++) {
			int centerX = 2 * mRadius * (i + 1) + i * mGap;
			canvas.drawCircle(centerX, centerTopY, mRadius, mPaint);
			canvas.drawCircle(centerX, centerBottomY, mRadius, mPaint);
		}
		
	}
}

3.布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff"
    tools:context="com.example.customview.Main5Activity" >

    <com.example.customview.CustomContainer
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:background="#ffbb33"
        android:padding="20dp"
        app:mColor="#fff"
        app:mGap="15dp"
        app:mHalfRadius="5dp" >

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center" >

            <ImageView
                android:id="@+id/img"
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:src="@drawable/jpg" />

            <TextView
                android:id="@+id/caption"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_toRightOf="@id/img"
                android:text="韩国美女卡券"
                android:textColor="#666666"
                android:textSize="18sp" />

            <TextView
                android:id="@+id/text1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignLeft="@id/caption"
                android:layout_below="@id/caption"
                android:layout_marginTop="10dp"
                android:text="秒杀价:50元"
                android:textColor="#ff0000"
                android:textSize="22sp" />

            <TextView
                android:id="@+id/text2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_below="@id/text1"
                android:layout_marginLeft="3dp"
                android:layout_marginTop="10dp"
                android:text="原价:150元"
                android:textColor="#999999"
                android:textSize="14sp" />
        </RelativeLayout>
    </com.example.customview.CustomContainer>

</RelativeLayout>

 

© 著作权归作者所有

August1996_
粉丝 2
博文 51
码字总数 29055
作品 0
湛江
程序员
私信 提问
加载中

评论(0)

Android实战经验之图像处理及特效处理的集锦(总结版)

1 Android学习笔记进阶之在图片上涂鸦(能清屏) 2 Android学习笔记之详细讲解画圆角图片 3 Android学习笔记进阶20之得到图片的缩略图 4 Android学习笔记进阶19之给图片加边框 5 Android学习笔...

xiaosi
2012/03/12
4.1W
25
2020年GitHub 上那些优秀Android开源库,这里是Top10!建议收藏!

前言 每过一段时间呀,我都会给大家带来一些从Github上收集的一些开源库,有的是炫酷动效,有的则是实用的工具和类库。2020年有哪些优秀的开源库呢?本期就为大家带精选的10个,排名不分先后...

qq5e819c40572d7
05/01
0
0
Android 制作逐渐显示动画(描边动画、矢量动画VectorDrawble)

传统的Android提供的动画只有平移、缩放、显示等效果,那么怎么才能实现逐渐绘制动画? 答案是使用矢量图动画。 一、 矢量图支持VectorDrawble Android 系统从5.0开始支持矢量图,可以通过 ...

Mr云台
2017/09/20
0
0
微信开放平台开发工具包(SDK)

iOS开发工具包 开发工具包(SDK) 使用微信分享、登录、收藏、支付等功能需要的库以及文件。点击下载iOS开发工具包64位 使用微信语音识别接口、语音合成接口。点击下载 语音SDK+Demo+开发文档...

雪深
2015/02/05
545
0
【Android程序员】找不到好工作?或许你应该开阔一下视野了!

我相信很多人都在经历这个阶段,过了入门期之后想要努力进阶,但是却苦苦没有方向。 每次遇到朋友问我这样的问题,每次我的回答也都会不一样。 其实我也很想总结出一套固定的答案,然后直接复...

Android进阶开发
2019/10/30
0
0

没有更多内容

加载失败,请刷新页面

加载更多

腾讯副总裁魏颖:提瓢入市,倚杖而归

  魏颖,腾讯公司副总裁,2008 年加入腾讯,全面负责公司薪酬福利、绩效管理、员工关系以及海外业务人力资源。   ————————   很多人对人力资源(HR)工作的理解就是一些人事流...

alkcendkljk
27分钟前
13
0
OSChina 周二乱弹 —— 我要一份儿大姐姐的爱

Osc乱弹歌单(2020)请戳(这里) 【今日歌曲】 @Cobbage :分享赵雷的单曲《阿刁 (Diao)》: 《阿刁 (Diao)》- 赵雷 手机党少年们想听歌,请使劲儿戳(这里) @喵星人123 :昨天睡到半夜 突然...

小小编辑
28分钟前
11
0
window下 mongodb开启用户名和密码 权限

在默认情况下,mongod是监听在127.0.0.1之上的,任何客户端都可以直接连接27017,且没有认证。 好处是,用户可以即时上手,不用担心被一堆配置弄的心烦意乱。 坏处是,公网服务器搭建MongoDB...

东东笔记
今天
9
0
数据倾斜

数据倾斜: 两种数据倾斜发生的现象: 80%情况下都发生挂了,只有极少20%情况下能把task执行完成 窄依赖:结构简单,如果发生数据丢失,方便查找丢失的数据 宽依赖:结构复杂,如何发生数据丢...

七宝1
今天
20
0
我的jdk源码(十一):ArrayList

一、概述 ArrayList类是AbstractList的子类,实现了具体的add(), set(), remove()等方法。它是一个可调整大小的数组可以用来存放各种形式的数据。 二、源码分析 (1) 类的声明,源码如下: ...

Java觉浅
昨天
24
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部