00:00
好,接下来呢,我们讲解第三个例子啊,圆形和圆角图片,首先呢,我们看一下这个运行的效果啊。这个呢,就是我们最终啊运行的效果,点击这个圆形和圆角。这里面进入这里面,上面是一个图片啊,下面呢,是这个要设置这个圆形图片这个按钮和这个设置圆角的按钮,点击设置圆形按钮,诶加载回来这个图片之后,将这个图片啊设置成圆形的。那这个圆角图片什么样的呢?诶一点击这个圆角,看这个四个角就变成这个圆弧形的了啊同时呢,你其实你还可以设置这个,每个圆弧这个大小都不一样,都可以同时这个背景色设置这个红颜色啊,这个我们可以设置啊,也可以不要,同时这个边框啊,这个蓝色的边框,诶这也是我们设置上去的啊,这个是也可以选择不要啊接下来呢,我们就开始实现这个呃,这个代码,那么这个布局啊啊同样我们还是不画了啊,我们直接粘贴一下啊,非常非常简单嘛,下面是一个t bar中间呢这一块是这个,呃,一个这个simple啊啊下面是分别是两个button啊,我就不画了。
01:11
找到我们这个代码啊,圆形和圆角又一个inent里面传一个三下文。卡activity,点接下来里面呢,来一个卡circle。And。Activity。二加回车启动跳转,将你探的进来,创建一下这个。牛街牛。
02:02
这个呢,就是这个啊,圆形圆角页面啊进来进来之后呢,我们把这个布局啊粘过来,布局找到这。看A,看C。这看那我们在啊对折代码啊,再看一下这布局整体呢,是一个这个线性布局啊,垂直方向的下面呢,这个是这个t bar啊也是它啊,再往下呢,就是这个simple啊这张图片,这也是free啊啊再往下面分别是两个button是圆形图片和圆角图片。嗯,好,接下来呢,我们,嗯,对这个。对象啊,View的对象进行一下处理,找到这个界面。Out shift加s generate生成一下。
03:00
然后呢,这里面看看button button暂时不要。和分下。顺手画一下标题,Nit奥加。Set test这个名称是什么呢?看一下圆形和圆角图片。啊,这是标题啊,标题处理完之后,接下来就是你点击这个设置圆形图片,那么这张图片啊,我要用这个采用圆形的方式啊去设置,要是点击这个圆角,那么是采用圆角的方式去设置啊,那分别处理一下两个button艾啊click。里面查一个r.id.BT fris卡。我们看一下这个ID。
04:00
第一个circle。VID粘贴一下click。里面传一个这个view。好,这是搞定一个,接下来下一个弹下。这个呢是设置圆形图片。下一个呢是设置圆角图片。啊,设置圆角图片,那接下来啊,在写代码之前啊,我们先看一下这个官网上啊,这个也是FS卡啊,他给我们提供的这个啊样例,包括这个圆角啊,圆圈啊啊等等进行设置啊进行设置。
05:05
啊,你看这些代码详细代码啊都有啊,这里面呢,我就不带大家读了啊,看一下我们给大家提供好的这个代码。首先呢,是这个圆形图片啊,你就直接粘过来就可以了啊,那在里面先看一下大家让大家分析一下啊,你可以从下往上看啊,首先呢,它需要的是加载一张图片啊,Set这个em image URL,也就是这个SDV啊,你当前这个view,那么这个UR啊,UI是怎么生成的呢?UI是这啊UI pass,这个就是这张图片的这个网络路径啊,拿后它拿到它之后啊,其实你就能设置这张图片了,那么怎么将这张图片设置成这个圆形图片呢?你需要对它进行进一步的修改啊,那修改它的前提是首先要有这么一个build啊generate啊builder拿到这个builder之后啊,builder.set round PS啊,也就是圆形的参数设置啊,那圆形参数设置里面需要传递一个palms啊,也是参数,具体这个圆型设置什么样的啊,你要是纯就是个。
06:13
行,那就是running palms there as磁口啊,就直接搞定了啊,同时别忘了把它传递到这个啊,Send hurricane啊,Hurrica这里面啊就可以了,那接下来呢,我们实现一下这个代码啊,设置圆形图片。到这同样首先拿到这个对象。第2SET em image ul啊,那就是U啊,需要一个。这个U,我们把它变成这个啊,统一的全局的,那就是uri等于uri PS里面传递这个图片的路径啊,我们复制一下这个路径。
07:10
啊,这也是这个图片的路径啊,正常情况下。这就可以了,把它变成全局的out shift的加F啊,就能加载一张图片了,那么我要想将这张图片设置成圆形的,那你还需要进一步的一些啊处理,首先呢,你有一个三瑞。Builder,创建一个builder里面呢,传一个resource get resource。二加灰色拿到这个build。将它变成全局的啊,全局的拿到build之后,Build。点盖上。点set。G。
08:08
Round啊,Palms里面呢,需要一个palms。A me,然后呢?后面别忘了来一个builder。啊,贾菲特生成这个hi瑞Y啊瑞Y,那么这个我们需要对它进行进一步的设计。啊。RO。Run palms for吗?Center啊radious,这就是设置一个圆角啊,圆角的大小,我们再来一个5CF啊,接下来呢,对这个palms进行进一步的设置啊,可设置也可以不设置啊点好这个呢,其实我们这个是圆呃圆形图片啊,那这个呢是呃设成圆角了,那我们把它设置成这个圆形的啊直接。
09:05
As circle啊就搞定了,下面的那个才是圆角的啊,这就是设置圆形。圆形图片。啊,这个参数呢,将这个图片设置成圆形的,然后得到一个hiriy,啊,那么怎么把这个huriy设置到这里面呢?这有一个方法,点that还Ricky,将它传进来。这样呢啊,就将这个图片啊配置好了,配置好之后呢,我们运行一下啊,看看效果能不能实现。啊,找到这个F卡。然后第三个圆形和圆角,点击第一个button,哎,这样呢,就加载一张啊圆形的图片啊,下面呢,我们开始设置这个啊圆角的图片啊,那设置之前呢,我们还是先看一下,带大家看一下这个代码。
10:15
这个是圆角的图片啊,这同样上面呢有这个图片的URL地址啊,接下来呢,还是有这个builder,这都是一样的,往下面下面这也是同样同样的去设置这加载这张图片啊,而这个地方呢,还是设置这个啊healthy hurricane啊hurricane通过这个running palms,也就是圆形的参数palms啊那跟上一个哪个地方有区别呢啊,才能把这张图片变成这个圆形的啊,圆角呢,其实就是这个palm这个参数啊,Palm参数也是刚才写错了,那地方啊,就是running palms.from circle run啊设这个圆角啊,然后下面这个地方呢,是设置这个是否有覆盖物,也就是背景的一个红颜色啊,让它有没有,你不设置也可以,下面这个呢,是设置这个边框啊,边框呢这个是啊五。
11:08
呃,再往下呢,是这个是否设成圆形啊,这你要是设成圆形,那么你就看不到这个啊圆角的效果了啊圆角效果好,接下来呢,我们还是先写一下这个代码。等这。第一步还是从这开始写啊设置。UU啊,这图片的路径呢啊,跟上一个路径是一样的啊,这都是加载图片。加载图片之后啊,接下来正常应该创建这么一个builder对吧?哎,那么就拿到这个builder,这个共用一个。build.set。Round PAL啊,圆形的参数设置里面传递一个pals,那么如果想用这么一个,那也可以把它变成全局的啊。
12:10
拿到它之后。第builder啊,加会啊啊这个是还啊hurriy好一点,那么hurriy同样用这个将它设置一下set。其实写到这是不是这个圆圆角和上面这个圆形啊,都一样啊啊,那么哪个地方不一样呢?接下来哎,就是这个。帕等于round。啊palms.from4口这个圆角,那么圆角这里面设置成啊50大小啊50,你设置60啊也行啊,都没问题,这样呢,其实就有那个圆角了,我们可以预习一下看看效果。
13:16
点击这个FS。第三个。哎,点击下面那个。看正常的这张图片就已经有这个圆角了啊,那么我还还要设置什么呢?比如说我要设置这个,大家看看一下这地方,我设置的它覆盖物啊,也就是覆盖层,最后底层那个啊红颜色那也可以是晒的这个over overlay color啊,同时呢,你可以晒这个棒子啊,也就这个边框啊都行啊,我给它粘过来带着大家看一下这个效果,看这。啊,这个是啊,啊帕斯好,那我们看一下跟上一次有什么区别。
14:13
来到这个F卡。圆形圆角啊,点击圆角看后面有一个这个红颜色的背景啊,你看这个red light吧,啊背景是,然后呢,包括这个边框啊,也就是个蓝颜色这个边框啊,它是这个啊5DP啊5PS啊五个像素啊好,那么这个呢,就实现了这个圆角啊和圆形图片。
我来说两句