xamarin.ios 实现圆形进度条

using System;
using UIKit;
using System.Drawing;
using CoreAnimation;

namespace PMM
{
    public class ProgressCircleView : UIView
    {
        protected CAShapeLayer _progressCircle;
        protected CAShapeLayer PageGrayCircle;
        public override CoreGraphics.CGRect Bounds {
            get
            {
                return base.Bounds;
            }
            set {
                base.Bounds = value;
                GrayCircle ();
            }
        }

        public ProgressCircleView ()
        {
            GrayCircle ();
        }

        /// <summary>
        /// Redraws the progress circle. If the circle is already on the screen, it removes that one and creates a new one using the
        /// current properties of the view
        /// </summary>
        void RedrawCircle ()
        {

            var centerPoint = new PointF ((float)this.Bounds.Width , (float)this.Bounds.Height );
            UIBezierPath circlePath = UIBezierPath.FromArc (centerPoint, this.Bounds.Width * .5f, (float)(-.5 * Math.PI), (float)(1.5 * Math.PI), true);

            _progressCircle = new CAShapeLayer ();

            _progressCircle.Path = circlePath.CGPath;
            _progressCircle.StrokeColor = UIColor.Red.CGColor;
            _progressCircle.FillColor = UIColor.Clear.CGColor;
            _progressCircle.LineWidth = 5f;
            _progressCircle.LineCap = CAShapeLayer.CapRound;
            _progressCircle.StrokeStart = 0f;
            _progressCircle.StrokeEnd = 0f;
            this.Layer.AddSublayer (_progressCircle);

        }
        void GrayCircle()
        {
            if (_progressCircle != null && _progressCircle.SuperLayer != null) {
                _progressCircle.RemoveFromSuperLayer ();
            }
            var centerPoint = new PointF ((float)this.Bounds.Width , (float)this.Bounds.Height );
            UIBezierPath circlePath = UIBezierPath.FromArc (centerPoint, this.Bounds.Width * .5f, (float)(1.5 * Math.PI), (float)(-.5 * Math.PI), false);

            PageGrayCircle = new CAShapeLayer ();

            PageGrayCircle.Path = circlePath.CGPath;
            PageGrayCircle.StrokeColor = UIColor.Gray.CGColor;
            PageGrayCircle.FillColor = UIColor.Clear.CGColor;
            PageGrayCircle.LineWidth = 4f;
            PageGrayCircle.LineCap = CAShapeLayer.CapRound;
            PageGrayCircle.StrokeStart = 0f;
            PageGrayCircle.StrokeEnd = 0f;
            this.Layer.AddSublayer (PageGrayCircle);
            RedrawCircle ();
        }

        /// <summary>
        /// Updates the progress circle.
        /// </summary>
        /// <param name="progressPercent">The percentage of the progress. Should be a value between 0.0 and 1.0</param>
        public void UpdateProgress(float progressPercent) {
            _progressCircle.StrokeEnd = progressPercent;
            PageGrayCircle.StrokeEnd = 1 - progressPercent;
        }
    }
}
时间: 2024-08-26 05:36:53

xamarin.ios 实现圆形进度条的相关文章

Xamarin iOS教程之进度条和滚动视图

Xamarin iOS教程之进度条和滚动视图 Xamarin iOS 进度条 进度条可以看到每一项任务现在的状态.例如在下载的应用程序中有进度条,用户可以很方便的看到当前程序下载了多少,还剩下多少.QQ音乐播放器中也使用到了进度条,它可以让用户看到当前音乐播放了多少,还剩多少等.在Xamarin.iOS中也提供实现进度条的类,即UIProgressView. [示例2-23]以下将实现进度条加载的效果.具体步骤如下: (1)创建一个Single View Application类型的工程,命名为

iOS 贝赛尔 圆形进度条

UIBezierPath *aPth = [UIBezierPath bezierPathWithArcCenter:CGPointMake(55, 65.f) radius:50.f startAngle:-M_PI_2 endAngle:M_PI_2 clockwise:YES]; aPth.lineWidth = 5.0f; aPth.lineCapStyle = kCGLineCapRound; aPth.lineJoinStyle = kCGLineJoinRound; [[UICol

IOS 自定义圆形进度条UISlider

#import <UIKit/UIKit.h> /** @name Constants */ /** * The styles permitted for the circular progress view. * * You can set and retrieve the current style of progress view through the progressViewStyle property. */ typedef enum { UICircularSliderStyle

IOS 圆形进度条

// // CCProgressView.h // Demo // // Created by leao on 2017/8/7. // Copyright ? 2017年 zaodao. All rights reserved. // #import <UIKit/UIKit.h> typedef NS_ENUM(NSInteger, CCProgressViewStyle) { CCProgressViewStyleCircle, // 圆形进度条 CCProgressViewStyleB

iOS 图片加载 圆形进度条

项目中有加载网络图片的需求,加一个加载的进度条会提高用户体验,网络不好的时候会清晰的看到图片加载的进度,比让用户看着满屏幕空白好.下面是我们项目自己封装的圆形进度条,分享给大家. 其实实现原理很简单,只是根据图片加载的进度来绘制一个圆. 先来看.h文件,需要一个进度的属性和进度条展示位置的方法: @property (nonatomic, assign) CGFloat progress; +(HMProgressView *)showHMProgressView:(UIView *)paren

iOS开发笔记-根据frame大小动态调整fontSize的自适应文本及圆形进度条控件的实现

最近同样是新App,设计稿里出现一种圆形进度条的设计,如下: 想了想,圆形进度条实现起来不难,但是其中显示百分比的文本确需要自适应,虽然可以使用时自己设定文本字体的大小,但是这样显得很麻烦,也很low. 查了一圈,目前实现的自适应UILabel,都是根据font大小动态调整frame的size,并不能满足我们的需求.  那么问题来了 如何实现一种能够根据frame大小自适应调整文本font size的圆形进度条呢? 我的实现思路很简单,首先计算出能够给予UILabel的frame最大尺寸,然后根

利用css3动画和border来实现圆形进度条

最近在学习前端的一些知识,发现border的功能十分强大啊! 首先来看看demo 就是这么一个圆形的进度条,在文本框中输入0-100的数值下面的进度条相应的转到多少 这个主要是利用border,旋转和css动画来实现的,主要思想是利用两个div来互相遮挡border形成的一个只有半圈有颜色的圆形,再利用旋转div的角度来调整显示 上代码: html+css+js(这里引入了jquery) <!DOCTYPE html> <html lang="en"> <

自定义圆形进度条

关于控件呢,我想大家应该都很熟悉了吧,android应用开发MVC架构中,控件担任着至关重要的作用,感觉可以说是基于控件的事件模型人机交互的基础吧.这种特性感觉在wpf开发中体现得更为直接,感兴趣的同学可以去了解一下.而android框架自身就已经给我们提供了很多控件.那么问题来了?为什么有那么多控件可以用,你还要去屑自定义控件呢?是因为大家闲的蛋疼吗?显然不是.个人认为只要有两方面吧,要么是觉得有些原生控件是在是丑得难以忍受(即使是在你已经自定义了他的shape,圆角,selector等一系列

Android自定义View——圆形进度条式按钮

介绍 今天上班的时候有个哥们问我怎么去实现一个按钮式的进度条,先来看看他需要实现的效果图. 和普通的圆形进度条类似,只是中间的地方有两个状态表示,未开始,暂停状态.而且他说圆形进度的功能已经实现了.那么我们只需要对中间的两个状态做处理就行了. 先来看看实现的效果图: 上面说了我们只需要处理中间状态的变化就可以了,对于进度的处理直接使用了弘洋文章中实现: http://blog.csdn.net/lmj623565791/article/details/43371299 下面开始具体实现. 具体实