Android实现边缘凹凸的View

转载

最近做项目的时候遇到一个卡劵的效果,由于自己觉得用图片来做的话可以会出现适配效果不好,再加上自己自定义view方面的知识比较薄弱,所以想试试用自定义View来实现。但是由于自己知识点薄弱,一开始居然想着用画矩形来设置边缘实现,后面一个哥们指导了我,在这里感谢他。

实现分析

上面的图片其实和普通的Linearlayout,RelativeLayout一样,只是上下两边多了类似于半圆锯齿的形状。那么只需要处理不同地方。可以在上下两条线上画一个个白色的小圆来实现这种效果。

假如我们上下线的半圆以及半圆与半圆之间的间距是固定的,那么不同尺寸的屏幕肯定会画出不同数量的半圆,那么我们只需要根据控件的宽度来获取能画的半圆数。

大家观察图片,很容易发现,圆的数量总是圆间距数量-1,也就是,假设圆的数量是circleNum,那么圆间距就是circleNum+1。

所以我们可以根据这个计算出circleNum.

circleNum = (int) ((w-gap)/(2*radius+gap));

这里gap就是圆间距,radius是圆半径,w是view的宽。

具体的实现

下面看代码:

上面定义了圆的半径和圆间距,同时初始化了这些值并且获取了需要画的圆数量。

接下来只需要一个一个将圆画出来就可以了。

简单的根据circleNum的数量进行了圆的绘制。

这里remain/2是因为,可以一些情况,计算出来的可以画的数量不是刚好整除的。这样就会出现右边最后一个间距会比其它的间距都要宽。

所以我们在绘制第一个的时候加上了余下的间距的一半,即使是不整除的情况。至少也能保证第一个和最后一个间距宽度一致。

这样就实现了,看看布局文件:

效果图:

作者通过非常巧妙和简单的方式实现了边缘特殊图像的绘制,相信大家可以轻松的学习到相关知识,不过这里指定了特定的颜色(白色),如果想要直接像橡皮擦一样擦成透明,可以使用xfermode来做处理。

源代码下载

源代码

参考链接

一起来学习android自定义控件—边缘凹凸的View

更新

利用边缘凹凸的View来实现比较好看的editText

效果如下

这里写图片描述

布局文件

<?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:paddingBottom="@dimen/activity_vertical_margin"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="0dp"android:paddingTop="@dimen/activity_vertical_margin"android:background="@color/backcircle"tools:context="com.zj.second.MainActivity"><com.zj.second.CouponDisplayView
        android:layout_marginRight="16dp"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#FFFFFF"android:padding="0dp"><EditText
            android:padding="20dp"android:textStyle="bold"android:layout_width="match_parent"android:layout_height="wrap_content"android:hint="姓 名"android:background="@null"android:textSize="16sp"/><View
            android:layout_width="fill_parent"android:layout_height="1dip"android:background="#FF909090" /><EditText
            android:padding="20dp"android:textStyle="bold"android:layout_width="match_parent"android:layout_height="wrap_content"android:hint="电 话"android:background="@null"android:textSize="16sp"/><View
            android:layout_width="fill_parent"android:layout_height="1dip"android:background="#FF909090" /><EditText
            android:padding="20dp"android:textStyle="bold"android:layout_width="match_parent"android:layout_height="wrap_content"android:hint="地 址"android:background="@null"android:textSize="16sp"/><View
            android:layout_width="fill_parent"android:layout_height="1dip"android:background="#FF909090" /><EditText        android:gravity="top|left"android:padding="20dp"android:layout_width="match_parent"android:layout_height="wrap_content"android:hint="案情描述"android:minLines="8"android:background="@null"/></com.zj.second.CouponDisplayView><ImageView        android:id="@+id/imageView_send"android:layout_width="36dp"android:layout_height="36dp"android:padding="0dp"android:layout_marginLeft="3dp"android:layout_marginTop="168dp"android:foreground="?android:attr/selectableItemBackground"android:src="@drawable/inline_reply_dialog_send"android:layout_alignParentRight="true"/></RelativeLayout>

参考链接

文本框 - Material Design 中文版 - 极客学院Wiki

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/494095.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【报告解读】126个国家、29个行业、36位高管认为AI的未来这么走

来源&#xff1a;网易智能人工智能&#xff08;AI&#xff09;已经使早期采用它的制造商能够更好地协调分析、商业智能(BI)、移动性和实时监控&#xff0c;以实现更快的营收增长&#xff0c;并比同行更快地成长壮大。如今&#xff0c;最顶级的18%的AI采用者将超过70%的精力投入…

自定义view实现水波纹效果

水波纹效果&#xff1a; 1.标准正余弦水波纹&#xff1b; 2.非标准圆形液柱水波纹&#xff1b; 虽说都是水波纹&#xff0c;但两者在实现上差异是比较大的&#xff0c;一个通过正余弦函数模拟水波纹效果&#xff0c;另外一个会运用到图像的混合模式&#xff08;PorterDuffXf…

“人机耦合”变成“人机大战” AI同传离成熟还有多远

来源&#xff1a;科学网9月21日&#xff0c;一篇指责科大讯飞“AI同传造假”的文章引发了社会广泛关注&#xff0c;文中知乎用户、同传译员Bell Wang表示&#xff0c;在日前举行的2018创新与新兴产业发展国际会议上&#xff0c;科大讯飞在现场和直播中展示的“AI同传”&#xf…

高中分类讨论题1

转载于:https://www.cnblogs.com/zjyyhs/archive/2013/05/23/3094220.html

Android拼图游戏

效果如下 游戏的设计 首先我们分析下如何设计这款游戏&#xff1a; 1、我们需要一个容器&#xff0c;可以放这些图片的块块&#xff0c;为了方便&#xff0c;我们准备使用RelativeLayout配合addRule实现 2、每个图片的块块&#xff0c;我们准备使用ImageView 3、点击交换&a…

亚马逊:从零售商向科技公司的质变

报告来源&#xff1a;国泰君安&#xff08;訾猛&#xff09;亚马逊以技术为核心驱动力&#xff0c;实现从电商向科技公司的跨越&#xff0c;形成电商、物流、AWS、新零售协同发展的完整生态圈。亚马逊从1995年开始为用户提供线上商品&#xff0c;从一家网上书店发展成全品类电商…

使用HTML5的Canvas画布来剪裁用户头像

日期&#xff1a;2013-5-23 来源&#xff1a;GBin1.com 本文来自极客标签社区用户webgeek的一个在线HTML5web开发小技巧&#xff0c;帮助你使用html5的画布功能来切割用户上传的大头照。 在线调试 例如需要剪裁的图片如下&#xff1a; 用来处理大头照的JS代码如下&#xff1a;…

Android之Tab类总结

本文主要包括以下Tab类实现方式 FragmentTabHostFragment实现传统的ViewPager实现 FragmentManagerFragment实现ViewPagerFragmentPagerAdapter实现TabPageIndicatorViewPagerFragmentPagerAdapter FragmentTabHostFragment实现 布局文件 <?xml version"1.0"…

美日两位科学家获2018年度诺贝尔生理或医学奖

来源&#xff1a;科学网当地时间10月1日上午11时30分&#xff08;北京时间10月1日下午5时30分&#xff09;2018年度诺贝尔生理或医学奖获得者揭晓。今年该奖项的获得者分别是美国得州大学奥斯汀分校免疫学家詹姆斯艾利森&#xff08;James P. Allision&#xff09;和日本京都大…

Rejection sampling - 直观解释

如图&#xff0c;红线是我们想要从中采样的概率分布$f(x)$。 拿一个盒子把这个概率分布罩起来&#xff0c;假设盒子的上边缘是$p(x)$。随机地向盒子里撒点&#xff0c;即盒子里的均匀分布。位于$f(x)$下方点的横坐标&#xff0c;即是来自于$f(x)$的一组样本。从算法的角度讲&am…

Android之记住密码与自动登陆实现

本文主要讲述了利用sharedpreference实现记住密码与自动登陆功能 根据checkbox的状态存储用户名与密码将结果保存在自定义的application中&#xff0c;成为全局变量 布局文件 <?xml version"1.0" encoding"utf-8"?> <ScrollView xmlns:andro…

智能硬件这5大领域竞争升级,将迎发展新模式

来源&#xff1a;亿欧网智能硬件是指具备信息采集能力&#xff0c;并可实现智能感知、交互、大数据服务等功能的新兴互联网终端产品&#xff0c;是“互联网人工智能”的重要载体。在手机、电视等终端产品实现智能化之后&#xff0c;信息技术也正通过软硬件结合的方式&#xff0…

Android实现圆形圆角图片

本文主要使用两种方法实现图形圆角图片 自定View加上使用Xfermode实现Shader实现 自定View加上使用Xfermode实现 /** * 根据原图和变长绘制圆形图片 * * param source * param min * return */ private Bitmap createCircleImage(Bitmap source, int min) { final Pain…

自动驾驶又陷“派系”之争:该约束行人还是让车更完美

来源&#xff1a;网易智能摘要&#xff1a;近日&#xff0c;全球人工智能专家吴恩达&#xff08;Andrew Ng&#xff09;表示&#xff0c;制造可靠自动驾驶汽车的最快方法是在行人方面采取完善措施&#xff0c;而不单是汽车。他说&#xff1a;“我们想告诉人们的是&#xff0c;请…

AjaxPro新发现-错误处理

当Ajax调用发生错误时,回调函数参数result会存在error属性,通常通过这个属性判断是否出现错误. 也可以使用默认处理函数,这样就可以为错误处理提供统一的函数 转载于:https://www.cnblogs.com/dwfbenben/archive/2013/05/24/3097535.html

Android仿微信界面

效果图 原理介绍 1、先绘制一个颜色&#xff08;例如&#xff1a;粉红&#xff09; 2、设置ModeDST_IN 3、绘制我们这个可爱的小机器人 回答我&#xff0c;显示什么&#xff0c;是不是显示交集&#xff0c;交集是什么&#xff1f;交集是我们的小机器人的非透明区域&#xff…

Google Brain与牛津大学主持最新《计算机视觉前沿》报告(146页PPT)

来源&#xff1a;专知牛津大学DanielaMassiceti, Saumya Jetley与Google Brain Sara Hooker等人9月13日在Deep LearningIndaba 深度学习大会上主持关于《计算机视觉前沿》的报告。重点围绕当前计算机视觉最重要但没有解决的一些问题&#xff0c;以及如何和非洲相关&#xff1f;…

89C52控制1602A液晶的计时器

一、LCD1602A液晶说明。 DataSheet说明&#xff08;技术参数&#xff09; ①此LCD共16个管脚。每个接口说明如下表。 PS&#xff1a;1-2管脚没什么好说的&#xff0c;就是接电源和地的。 3管脚是偏压信号&#xff0c;这一管脚一般可以接个滑动变阻器&#xff0c;通过调节滑动变…

重磅 | 中国工程院提出新一代智能制造

来源&#xff1a;WPR近日&#xff0c;中国工程院院刊《Engineering》推出最新观点性文章“走向新一代智能制造”&#xff0c;作者周济、李培根、周艳红等&#xff0c;文章指出智能制造是一个不断演进发展的大概念&#xff0c;可归纳为三个基本范式&#xff1a;数字化制造、数字…

C# Obsolete

Obsolete 属性将某个程序实体标记为一个建议不再使用的实体。每次使用被标记为已过时的实体时&#xff0c;随后将生成警告或错误&#xff0c;这取决于属性是如何配置的。例如&#xff1a; 上面在Main函数中调用&#xff0c;只产生了一个警告的信息。 如果将MyObsolete类中的Get…