圆形_圆形图标 - CSDN
精华内容
参与话题
  • html实现圆形图片

    千次阅读 2020-03-13 17:11:07
    在学习前端的过程中,我发现了一个很有趣的例子,对图像以圆形显示,div和a属性却又不一样的效果和操作。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>圆形...

    在学习前端的过程中,我发现了一个很有趣的例子,对图像以圆形显示,div和a标签却有不一样的效果和操作。

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>圆形头像实现</title>
            <!-- <link rel="stylesheet" href="css/mypage.css" /> -->
        </head>
        <body>
            <p>div例子</p>
            <div  style="width:100px; height:100px; border-radius:100%; overflow:hidden;">
                <img src="images/o.jpg" alt="">
            </div>
            <br />
            <p>a属性不固定位置</p>

            <a href="#"  style="width:100px; height:100px; border-radius:100%; overflow:hidden;">
                <img src="images/o.jpg" alt="">
            </a>    
            <br />
            <p>a属性固定位置</p> 
            <a href="#"  style="position: fixed; top: 70%;left: 10%; width: 100px;  height:100px; border-radius:100%; overflow:hidden;">
                <img src="images/o.jpg" alt="">
            </a>
        </body>
    </html>

    效果图:

     

    展开全文
  • 生成圆形Image

    2019-11-23 16:45:38
    目标任务:实现一个圆形面片的Image,实现效果如下: 为什么要实现这个东西呢,其实原先在做这种圆形效果的时候都是在用Mask实现的(相信很多都是这样的~(罒ω罒)),但是最近了解了下优化方面的知识,发现Mask...

    目标任务:实现一个圆形面片的Image,实现效果如下:

    为什么要实现这个东西呢,其实原先在做这种圆形效果的时候都是在用Mask实现的(相信很多都是这样的~(罒ω罒)),但是最近了解了下优化方面的知识,发现Mask还是很占用DrawCall的,所以本着精益求精的 态度,学习了下怎么自己做一个圆形的Image。

     

    这里可能先要了解一下Image是怎么渲染出来的,具体的我就不说了,就说个简单的,我们生成一个Cube,我们可以看到他的网格是由很多三角形拼起来的,而其中每一个三角形是由三个顶点组成的,我们要做的其实就是生成多个这样的三角形来组成一个圆形(这里还要说下这样的三角形面片的正反面,在我们设置顶点的时候,顶点输入顺序是应该按照顺时针输入的,这样我们才会看见生成的面,不然会变成透明的样子,不信可以试下~~~)。

     

    代码如下

    using UnityEngine;
    using UnityEngine.Sprites;
    using UnityEngine.UI;
    
    public class CircleImage : Image {
    
    	private int segements;//圆形由多少个三角形拼成
    	
    	protected override void OnPopulateMesh(VertexHelper vh)
    	{
    		segements = 100;
    		vh.Clear();
    		//图片宽高
    		float width = rectTransform.rect.width;
    		float height = rectTransform.rect.height;
    		Vector4 uv = overrideSprite != null ?       DataUtility.GetOuterUV(overrideSprite) : Vector4.zero;
    		//uv宽高
    		float uvWidth = (uv.z - uv.x) * 0.5f;
    		float uvHeight = (uv.w - uv.y) * 0.5f;
    		//贴图的中心点
    		Vector2 uvCenter = new Vector2(uvWidth, uvHeight);
    		//uv转Pos坐标转换系数(不懂得可以试下让UVで宽高乘以零点几)
    		Vector2 converRatio = new Vector2(uvWidth/width,uvHeight/height);
    		//求每一个三角形的弧度  公式:2π/个数
    		float radian = (2 * Mathf.PI) / segements;
    		//设置半径
    		float radius = width * 0.5f;
    
    		UIVertex origin = new UIVertex();
    		origin.color = color;
    		origin.position = Vector3.zero;
    		//获取到当前原点的UV坐标
    		origin.uv0 = new Vector2(origin.position.x * converRatio.x+uvCenter.x, origin.position.y * converRatio.y+uvCenter.y);
                    //添加顶点信息
    		vh.AddVert(origin);
    
    		//顶点数量
    		int vertexCount = segements + 1;
    		//当前弧度
    		float curRadian = 0;
    		for (int i = 0; i < vertexCount; i++)
    		{
    			float x = Mathf.Cos(curRadian) * radius;
    			float y = Mathf.Sin(curRadian) * radius;
    			curRadian += radian;
    			//生成顶点
    			UIVertex vertexTemp = new UIVertex();
    			vertexTemp.color = color;
    			vertexTemp.position = new Vector2(x,y);
    			vertexTemp.uv0 = new Vector2(vertexTemp.position.x * converRatio.x+uvCenter.x, vertexTemp.position.y * converRatio.y+uvCenter.y);
    			vh.AddVert(vertexTemp);
    		}
    		//生成面片
    		int id = 1;
    		for (int i = 0; i < segements; i++)
    		{
    			//id从1开始递增,设置三角形
    			vh.AddTriangle(id,0,id+1);
    			id++;
    		}
    	}
    }
    

     

    展开全文
  • 制作圆形图片,你会以下几种?

    千次阅读 2018-08-10 06:58:30
    但是你是否想知道,除了你所会的那几张方法以外,还什么什么方法制作圆形图片呢?我们一一学习~ 1 XferMode 关于通过使用XferMode方式创建圆形图片,hongyang大神的《 Android Xfermode 实战 实现圆形、圆角图片 ...

    说起圆角图片,相信每个人心中都有自己的圆角图片制作方法。但是你是否想知道,除了你所会的那几张方法以外,还什么什么方法制作圆形图片呢?我们一一学习~

    1 XferMode

    关于通过使用XferMode方式创建圆形图片,hongyang大神的《 Android Xfermode 实战 实现圆形、圆角图片 》有讲,我这里大致把思路总结一下,我们知道,XferMode主要是将2张图片合在一起,由用户自己决定是选中图片重叠的部分还是非重叠的部分,可以参考Android官方提供的图片: 
    Xfermode原理 
    我们可以选择DstIn的方式来绘制圆形图,即在我们的原图上面再画一个实心圆形图,首先,我们先写一个函数,用于生成实心圆形的Bitmap:

        private Bitmap mCircleBitmap;
    
        //生成一个实心圆形Bitmap,这个Bitmap宽高要与当前的View的宽高相同
        private Bitmap getCircleBitmap() {
            if (mCircleBitmap == null) {
                mCircleBitmap = Bitmap.createBitmap(2 * mRadius, 2 * mRadius,
                        Config.ARGB_8888);
                Canvas canvas = new Canvas(mCircleBitmap);
    
                mPaint.reset();
                mPaint.setStyle(Style.FILL);
                canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
            }
            return mCircleBitmap;
        }
    

    然后,再将这个Bitmap“盖”到用户设置的图片上面:

    //将两张图片以XferMode(DST_IN)的方式组合到一张照片中
        private Bitmap combineBitmap(Drawable drawable, Bitmap maskBitmap) {
            int width = drawable.getIntrinsicWidth();
            int height = drawable.getIntrinsicHeight();
            // 将drawable转bitmap
            Bitmap bitmap = Bitmap.createBitmap(width, height, Config.ARGB_8888);
            Canvas canvas = new Canvas(bitmap);
            //将图片自动放缩到View的宽高,即2倍的半径
            drawable.setBounds(0, 0, mRadius*2, mRadius*2);
            drawable.draw(canvas);
    
            // 先将XferMode设置好,然后将盖在上面的bitmap绘制出来
            mPaint.reset();
            mPaint.setXfermode(xfermode);
            canvas.drawBitmap(maskBitmap, 0, 0, mPaint);
            mPaint.setXfermode(null);
    
            return bitmap;
        }

    最后再将最终的Bitmap绘制到画板上面:

    @Override
        protected void onDraw(Canvas canvas) {
            //获取设置的src图片
            Drawable drawable = getDrawable();
            //获取盖在src上面的实心圆形Bitmap
            Bitmap circleBitmap = getCircleBitmap();
    
            //两张图片以XferMode(DST_IN)的方式组合
            Bitmap bitmap = combineBitmap(drawable, circleBitmap);
    
            //将最终的bitmap画到画板上面
            canvas.drawBitmap(bitmap, 0, 0, mPaint);
    
        }
    

    看看完整的代码吧~

    package com.hc.circleimage;
    
    import android.content.Context;
    import android.graphics.Bitmap;
    import android.graphics.Bitmap.Config;
    import android.graphics.Canvas;
    import android.graphics.Paint;
    import android.graphics.Paint.Style;
    import android.graphics.PorterDuff;
    import android.graphics.PorterDuffXfermode;
    import android.graphics.Xfermode;
    import android.graphics.drawable.Drawable;
    import android.util.AttributeSet;
    import android.widget.ImageView;
    
    public class XfermodeCircleImage extends ImageView {
        private int mRadius;
        private Paint mPaint;
        private Xfermode xfermode;
        private Bitmap mCircleBitmap;
    
        public XfermodeCircleImage(Context context) {
            super(context);
            init();
        }
    
        public XfermodeCircleImage(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }
    
        private void init() {
            mPaint = new Paint();
            xfermode = new PorterDuffXfermode(PorterDuff.Mode.DST_IN);
        }
    
        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
            int width = getMeasuredWidth();
            int height = getMeasuredHeight();
    
            if (width > height) {
                mRadius = height / 2;
            } else {
                mRadius = width / 2;
            }
    
            setMeasuredDimension(mRadius * 2, mRadius * 2);
        }
    
        //生成一个实心圆形Bitmap,这个Bitmap宽高要与当前的View的宽高相同
        private Bitmap getCircleBitmap() {
            if (mCircleBitmap == null) {
                mCircleBitmap = Bitmap.createBitmap(2 * mRadius, 2 * mRadius,
                        Config.ARGB_8888);
                Canvas canvas = new Canvas(mCircleBitmap);
    
                mPaint.reset();
                mPaint.setStyle(Style.FILL);
                canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
            }
            return mCircleBitmap;
        }
    
        //将两张图片以XferMode(DST_IN)的方式组合到一张照片中
        private Bitmap combineBitmap(Drawable drawable, Bitmap maskBitmap) {
            int width = drawable.getIntrinsicWidth();
            int height = drawable.getIntrinsicHeight();
            // 将drawable转bitmap
            Bitmap bitmap = Bitmap.createBitmap(width, height, Config.ARGB_8888);
            Canvas canvas = new Canvas(bitmap);
            //将图片自动放缩到View的宽高,即2倍的半径
            drawable.setBounds(0, 0, mRadius*2, mRadius*2);
            drawable.draw(canvas);
    
            // 先将XferMode设置好,然后将盖在上面的bitmap绘制出来
            mPaint.reset();
            mPaint.setXfermode(xfermode);
            canvas.drawBitmap(maskBitmap, 0, 0, mPaint);
            mPaint.setXfermode(null);
    
            return bitmap;
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            //获取设置的src图片
            Drawable drawable = getDrawable();
            //获取盖在src上面的实心圆形Bitmap
            Bitmap circleBitmap = getCircleBitmap();
    
            //两张图片以XferMode(DST_IN)的方式组合
            Bitmap bitmap = combineBitmap(drawable, circleBitmap);
    
            //将最终的bitmap画到画板上面
            canvas.drawBitmap(bitmap, 0, 0, mPaint);
    
        }
    
    }
    
    

    最后看看效果吧~ 
    圆角图片

    2 BitmapShader

    同样的,hongyang大神也写过关于BitmapShader方式绘制圆形图片《 Android BitmapShader 实战 实现圆形、圆角图片 》,我们同样来个简单总结,Shader翻译成中文叫“着色器”,而我们的BitmapShader是Shader的子类,BitmapShader有啥作用呢,它可以根据你设置的方式(下面介绍)将图片铺满你所选的区域,有哪几种方式“铺”呢?有以下几种: 
    (1)CLAMP:拉伸,在x方向上是图片的最后一列像素重复平铺,而y方向是最后一行往下拉伸 
    (2)REPEAT: 重复,很容易理解,图片重复平铺过去 
    (3)MIRROR:镜像,就是将图片翻转

    我们来看几张图片感受一下: 
    CLAMP的方式: 
    CLAMP方式对应的效果 
    REPEAT方式 
    REPEAT方式对应的效果 
    MIRROR方式 
    MIRROR方式对应的效果

    使用BitmapShader制作圆形图片的方法非常简单,只需通过Bitmap构造出一个BitmapShader,并将这个BitmapShader设置到当前的Paint当中,用这个Paint绘制一个圆就可以了,先看看onDraw函数:

        @Override
        protected void onDraw(Canvas canvas) {
            // 将Drawable转为Bitmap
            Bitmap bmp = drawableToBitmap(getDrawable());
            // 通过Bitmap和指定x,y方向的平铺方式构造出BitmapShader对象
            BitmapShader mBitmapShader = new BitmapShader(bmp, TileMode.CLAMP,
                    TileMode.CLAMP);
            // 将BitmapShader设置到当前的Paint对象中
            mPaint.setShader(mBitmapShader);
            // 绘制出一个圆
            canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
    
        }

    其中,drawableToBitmap是将Drawable对象转为Bitmap对象:

    private Bitmap drawableToBitmap(Drawable drawable) {
        if (drawable instanceof BitmapDrawable) {
            return ((BitmapDrawable) drawable).getBitmap();
        } else {
            int width = drawable.getIntrinsicWidth();
            int height = drawable.getIntrinsicHeight();
            Bitmap bitmap = Bitmap.createBitmap(width, height,
                    Bitmap.Config.ARGB_8888);
            Canvas canvas = new Canvas(bitmap);
            drawable.setBounds(0, 0, width, height);
            drawable.draw(canvas);
            return bitmap;
        }
    }
    

    我们看看完整代码吧

    package com.hc.circleimage;
    
    import android.content.Context;
    import android.graphics.Bitmap;
    import android.graphics.BitmapShader;
    import android.graphics.Canvas;
    import android.graphics.Paint;
    import android.graphics.Shader.TileMode;
    import android.graphics.drawable.BitmapDrawable;
    import android.graphics.drawable.Drawable;
    import android.util.AttributeSet;
    import android.widget.ImageView;
    
    public class ShaderCircleImage extends ImageView {
    
        private int mRadius;
        private Paint mPaint;
    
        public ShaderCircleImage(Context context) {
            super(context);
            init();
        }
    
        public ShaderCircleImage(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }
    
        private void init() {
            mPaint = new Paint();
        }
    
        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
            int width = getMeasuredWidth();
            int height = getMeasuredHeight();
    
            if (width > height) {
                mRadius = height / 2;
            } else {
                mRadius = width / 2;
            }
    
            setMeasuredDimension(mRadius * 2, 2 * mRadius);
        }
    
        private Bitmap drawableToBitmap(Drawable drawable) {
            if (drawable instanceof BitmapDrawable) {
                return ((BitmapDrawable) drawable).getBitmap();
            } else {
                int width = drawable.getIntrinsicWidth();
                int height = drawable.getIntrinsicHeight();
                Bitmap bitmap = Bitmap.createBitmap(width, height,
                        Bitmap.Config.ARGB_8888);
                Canvas canvas = new Canvas(bitmap);
                drawable.setBounds(0, 0, mRadius*2, mRadius*2);
                drawable.draw(canvas);
                return bitmap;
            }
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            // 将Drawable转为Bitmap
            Bitmap bmp = drawableToBitmap(getDrawable());
            // 通过Bitmap和指定x,y方向的平铺方式构造出BitmapShader对象
            BitmapShader mBitmapShader = new BitmapShader(bmp, TileMode.CLAMP,
                    TileMode.CLAMP);
            // 将BitmapShader设置到当前的Paint对象中
            mPaint.setShader(mBitmapShader);
            // 绘制出一个圆
            canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
    
        }
    }
    
    

    最后是要看看效果的,但是效果跟前面的效果是一样的,我们还是看一下吧~ 
    圆角图片

    3 ClipPath

    前面的2中方法我们都见过,我们在看另一种方法吧ClipPath,或许你听说过Canvas对象的clipPath方法,或者是用过这个方法,可是有没有想过这个方法也可以用来绘制圆形图片呢?

    我们看看代码吧:

    @Override
    protected void onDraw(Canvas canvas) {
        // 将Drawable转为Bitmap
        Bitmap bmp = drawableToBitmap(getDrawable());
        Path path = new Path(); 
        //按照逆时针方向添加一个圆
        path.addCircle(mRadius, mRadius, mRadius, Direction.CCW);
        //先将canvas保存
        canvas.save();
        //设置为在圆形区域内绘制
        canvas.clipPath(path);
        //绘制Bitmap
        canvas.drawBitmap(bmp, 0, 0, mPaint);
        //恢复Canvas
        canvas.restore();
    }

    是不是如此简单?过于简单,注释已经写明各行代码的意思啦!drawableToBitmap函数在上面一节解释过啦,这里就不再重复解释了,看看完整代码吧:

    package com.hc.circleimage;
    
    import android.content.Context;
    import android.graphics.Bitmap;
    import android.graphics.Canvas;
    import android.graphics.Paint;
    import android.graphics.Path;
    import android.graphics.Path.Direction;
    import android.graphics.drawable.BitmapDrawable;
    import android.graphics.drawable.Drawable;
    import android.util.AttributeSet;
    import android.widget.ImageView;
    
    public class ClipCircleImage extends ImageView {
        private int mRadius;
        private Paint mPaint;
    
        public ClipCircleImage(Context context) {
            super(context);
            init();
        }
    
        public ClipCircleImage(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }
    
        private void init() {
            mPaint = new Paint();
        }
    
        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
            int width = getMeasuredWidth();
            int height = getMeasuredHeight();
    
            if (width > height) {
                mRadius = height / 2;
            } else {
                mRadius = width / 2;
            }
    
            setMeasuredDimension(mRadius * 2, 2 * mRadius);
        }
    
        private Bitmap drawableToBitmap(Drawable drawable) {
            if (drawable instanceof BitmapDrawable) {
                return ((BitmapDrawable) drawable).getBitmap();
            } else {
                int width = drawable.getIntrinsicWidth();
                int height = drawable.getIntrinsicHeight();
                Bitmap bitmap = Bitmap.createBitmap(width, height,
                        Bitmap.Config.ARGB_8888);
                Canvas canvas = new Canvas(bitmap);
                drawable.setBounds(0, 0, mRadius*2, mRadius*2);
                drawable.draw(canvas);
                return bitmap;
            }
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            // 将Drawable转为Bitmap
            Bitmap bmp = drawableToBitmap(getDrawable());
            Path path = new Path(); 
            //按照逆时针方向添加一个圆
            path.addCircle(mRadius, mRadius, mRadius, Direction.CCW);
            //先将canvas保存
            canvas.save();
            //设置为在圆形区域内绘制
            canvas.clipPath(path);
            //绘制Bitmap
            canvas.drawBitmap(bmp, 0, 0, mPaint);
            //恢复Canvas
            canvas.restore();
        }
    }
    
    

    效果虽然跟上面两节是一样的,但是我们还是看一下效果吧~ 
    圆角图片

    4 Alpha提取

    现在我们看看一个很少见的方法,这个方法也是我不怎么推荐的方法,它是通过将一个张图的Alpha通道值设置到另外一张图中,啥意思呢?就是说,将两张图片的透明度设置为一模一样!看上去很酷的样子~,虽然不推荐,但是我们可以去学习一下嘛~可能某些项目需求中只能用这种方法去实现呢?

    //获取圆形Bitmap
    private Bitmap getCircleMask() {
        Bitmap bitmap = Bitmap.createBitmap(mRadius * 2, mRadius * 2,
                Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
        return bitmap;
    }
    //将rgbBitmap的RGB值与alphaBitmap的alpha值组成新的Bitmap
    private Bitmap getBitmap(Bitmap rgbBitmap, Bitmap alphaBitmap) {
        Bitmap newBmp = Bitmap.createBitmap(mRadius * 2, mRadius * 2,
                Config.ARGB_8888);
    
        int alphaMask = 0xFF << 24;
        int rgbMask = ~alphaMask;
        for (int x = 0; x < 2 * mRadius; x++) {
            for (int y = 0; y < 2 * mRadius; y++) {
                int color = (rgbMask & rgbBitmap.getPixel(x, y))
                        | (alphaMask & alphaBitmap.getPixel(x, y));
                newBmp.setPixel(x, y, color);
            }
    
        }
        return newBmp;
    }
    
    @Override
    protected void onDraw(Canvas canvas) {
        // 将Drawable转为Bitmap
        Bitmap rgbBitmap = drawableToBitmap(getDrawable());
        //提取alpha值通道
        Bitmap alphaBitmap = getCircleMask().extractAlpha();
        //将最终图片绘制出来
        canvas.drawBitmap(getBitmap(rgbBitmap, alphaBitmap), 0, 0, mPaint);
    }

    我们可以看到,通过两个for循环来新建合成一个新的图片,这个效率非常的低下!!!!!实际中不推荐采用这种方式,当然了,我们可以通过使用RenderScript并行处理,最终效率也不会比前面3种方法差!最终效果我就不贴上来了,依然是与前面几种方法是相同的

    最后,把源码献上:http://download.csdn.net/detail/huachao1001/9541176

    展开全文
  • 圆形DIV

    2019-07-15 16:26:54
    <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">#a{ top:200px; left:350px;... ...

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style type="text/css">
    #a
    {
    top:200px;
    left:350px;
    width:50px;
    height:50px;
    -moz-border-radius:15px;
    -webkit-border-radius:15px;
    border-radius:25px;/*倒角半径*/
    /*阴影*/box-shadow: 5px/*左右偏移,负值左,正值右*/ 3px/*上下偏移,负值上,正值下*/ 25px/*虚化度,值越大越虚*/ red;
    background-color:#0F0;
    position:absolute;}
    </style>
    </head>

    <body>
    <div id="a"></div>
    </body>

    转载于:https://www.cnblogs.com/m-m-g-y0416/p/5502462.html

    展开全文
  • html+css圆形图片

    千次阅读 2019-07-21 11:14:36
    -- 图一:border-radius牛刀小试,只出圆角,不求圆形 --> <img style="margin-top: 100px;idth:200px;height:200px;border-radius:20px;" src="http://b.hiphotos.baidu.com/image/pic/item/...
  • 圆形图片

    2019-07-08 13:07:15
    //图片路径 <img class="imghead" src="<shiro:principal property="headImage" />" /> //css样式 <style type="text/css"> img{width:90px; height:90px; border-radius:50%;-webkit-...
  • Android TextView圆形背景

    千次阅读 2019-09-26 10:01:24
    Android TextView圆形背景 很多时候我们的头像根本不是ImageView,而是TextView。那么这个时候又要我们显示为圆形的头像该怎么做呢? 首先,我们先来看看最后实现的效果。 图中的蓝色圆形背景就是在TextView上...
  • 微信小程序显示圆形图片

    万次阅读 2019-03-23 21:02:07
    我们的页面大部分要求头像要显示圆形,例如 做法 在.wxss文件中,添加border-radius这个属性即可 .avatar{ height: 50px; width: 50px; border-radius: 25px; } 在.wxml中的image中元素,引用这个样式即可...
  • android开发中圆形按钮的实现

    万次阅读 2018-03-03 13:37:10
    在drawable目录下创建一个样式btn_circle.xml。代码如下:&lt;layer-list xmlns:android="http://schemas.android.com/apk/res/android"&gt; &lt;item&...corners androi...
  • img 标签如何使图片成为圆形

    千次阅读 2019-06-21 00:01:41
    style="width:100px; height:100px; border-radius:50%;
  • HTML实现圆形头像效果

    万次阅读 2018-03-28 17:34:36
    展示圆形的图片是很多常见需求之一,因为有Android开发经验,难免会从Android开发角度去考虑问题,Android中实现一张图片的圆形效果一般通过自定义view的clip处理,而HTML却很简单。虽然简单,但还是遇到一点坑,...
  • 就类似于驾考宝典里面多选题的那种布局?还有就是那个大神做过类似于考试系统的开发,里面包含单选题,多选题,判断题,填空题,简答题的这种,希望大神们帮我一下 现在卡住实在做不了了。
  • Altium Designer圆形、椭圆形铺铜

    千次阅读 2017-09-25 19:27:41
    首先在任何层,用“Place”-“Full Circle”画出圆形,半径之类的可以设置。 然后选中画出的圆,执行“Tools”-“Covert”-“Create Polygon from Selected Primitives”,就可以把刚才画的圆转化为铺铜了。 ...
  • Android修改圆形progressBar颜色

    万次阅读 2018-01-06 16:13:52
    查了半天资料,没查到怎样修改progressBar的方法,全都是重新写个ProgressBar,其实很简单在只要一句xml里一句化就可以 android:indeterminateTint="#d38fdb" 害我找半天?,都怪我英语太不好,从字面完全看不...
  • 添加一个button,希望它的形状是圆形的,还要有大小、背景的属性
  • Glide4.0后支持圆形图片及其使用方式

    万次阅读 2018-03-09 09:33:21
    搬运自:http://blog.csdn.net/u011866128/article/details/75084787弄成圆形图片很简单:1.回调获取bitmap2.clip画布3.setXfermode但是用它原生的api肯定是最好的!compile '...
  • 圆形相机预览窗口 思路:自定义SurfaceView,重写其draw(Canvas canvas)方法,裁剪画布 @Override public void draw(Canvas canvas) { Log.e("onDraw", "draw: test"); Path path = new Path(); //设置裁剪的...
  • css 实现圆形图像

    万次阅读 2018-03-27 10:41:17
    原文转载自...图片宽高相等,width:300px; height:300px; 把他变成宽高100px的圆形头像img{width:100px; height:100px; border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;}2...
  • 将button变成圆形(有弧度)

    万次阅读 2020-06-25 15:52:17
    border-radius可以将button变成圆形,也可以给div加有弧度边框 border-radius 规则: 一个值:四个圆角值相同 两个值:第一个值为左上角与右下角,第二个值为右上角与左下角 三个值:第一个值为左上角, 第二个值为...
  • Android自定义ImageView实现圆形图片

    万次阅读 2018-03-02 18:05:30
    自定义ImageView实现圆形图片,主要是在onDraw()方法中实现绘制圆形图片,在onMeasure()中测量圆形的半径并设置View的宽高。效果如下图代码如下public class CircleImageView extends ImageView { //画笔 ...
1 2 3 4 5 ... 20
收藏数 144,419
精华内容 57,767
关键字:

圆形