前言

前两天写了一个轮子，主要是给图片视图添加标签的，昨天在微博上艾特喵大、叶神和iOS程序犭袁，然后火了一把，首先我感谢各位对这个小小功能的关注，让我受宠若惊。效果主要是这个样子

这两天也有小伙伴私信我能不能简单的讲一下其中的原理，其实用到的知识很简单，今天我就简单地说一下原理和实现。

原理

为了方便，我们姑且称这个控件是LBTagView，他的组成主要是一个带有三角形Label、一个小圆点的UIView和CALayer逐渐放大的圆环。三角形的Label是用CAShapeLayer结合UIBezierPath画出来的，大致的原理就是这样的，下面我们来把主要的步骤实现一下。

实现

• 三角形的Label

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

- (void)triangle:(UILabel *)label
{
    [label.layer.sublayers makeObjectsPerformSelector:@selector(removeFromSuperlayer)];
    CGFloat angleWidth = 10;
    UIBezierPath  * path =  [ UIBezierPath  new ];
    [path moveToPoint :( CGPoint ) { angleWidth ,  0 }];
    [path addLineToPoint :( CGPoint ) { 0, CGRectGetHeight(label.frame)/2.0}];
    [path addLineToPoint :( CGPoint ) { angleWidth, CGRectGetHeight(label.frame)}];
    [path addLineToPoint :( CGPoint ) { CGRectGetWidth(label.frame), CGRectGetHeight(label.frame)}];
    [path addLineToPoint :( CGPoint ) { CGRectGetWidth(label.frame), 0}];
    [path addLineToPoint :( CGPoint ) { angleWidth, 0}];
    CAShapeLayer* mask = [CAShapeLayer layer];
    mask.path = path.CGPath ;
    label.layer.mask = mask;
}

这些代码所要达到的效果大概如下，其实显示的主要是CAShapeLayer所在红框部分的内容

今天看了喵神的年终总结，感触挺多的。回头看看自己的一年，今天我一直在回忆15年自己做了些什么，索性也来做个记录吧！

15年对我来说，注定是不平凡的一年！

工作

在14年末开始准备App2.0版本的开发工作，到15年初2.0版本的上线，新版本的整个界面风格完全发生了变化，代码从零开始，经过了两个半月的时间，保质保量的完成了新版本的发布！在15年里，App小版本迭代了十多次，基本上是每月一更，另外又开发了两个全新的App，每次开发都去不断尝试新的东西，研究新的技术，让我学到了很多。无论是个人技术的提升，还是团队的管理。

个人技能

今年参与开发了三个项目，两个是由我主开发，从项目框架的搭建到代码质量的把控，自己的技能都提升了不少。搭建项目的时候，一定要考虑整个App的布局，一个好的框架能提升不少开发时间的，然后就是基类的封装，在封装一些基类的时候，一定要考虑到共性和特性；网络层的设计，数据存储的设计等。还有一点我感觉最重要的就是代码规范，代码规范，代码规范！！！重要的事情说三遍。好的代码能使我看着舒服，能写注释的尽量写注释，方便以后维护。

本文针对 ss-panel V2 版本的教程，更新于 2018-1-4
服务器vultr、digitalocean，系统版本 Ubuntu 16.04.3 LTS 上测试通过

周末本想出去转转，无奈帝都的雾霾太大，只能在家里撸码，整了一个ss账号分享平台，在这记录一下过程吧。

本文是基于Ubuntu 14.04下使用后端manyuser和前端ss-panel，使用nginx做代理所搭建的。
服务器推荐vultr、digitalocean。

过程

首先我们远程登录服务器，安装nginx,mysql和php,具体命令如下：

1
2
3
4

root@ubuntu-512mb-sfo1-01:~# apt-get update
root@ubuntu-512mb-sfo1-01:~# apt-get install nginx
root@ubuntu-512mb-sfo1-01:~# apt-get install mysql-client mysql-server
root@ubuntu-512mb-sfo1-01:~# apt-get install php php-fpm php-cli php-cgi php-mysql php-gd

过程中如果没有错误，那就说明我们安装成功了，如果服务器中有这些环境，则可以忽略对应的步骤。

接下来我们就要创建数据库了，运行mysql -u root -p，输入root密码。开始创建shadowsocks数据库，具体 SQL:create database shadowsocks; 如下图：

然后建立一个名为ss，密码为ss的MySQL用户，因为这个用户只能本地登录，所以密码简单点也无所谓：

1

mysql>  grant all privileges on shadowsocks.* to ss@localhost identified by 'ss';

创建完成我们退出MySQL:

1

mysql>  exit；

到这步，我们的数据库已经完成了。

最近做项目的时候，射击狮设计了一个环形的进度条用来向用户呈现产品的信息，做完之后，感觉这个效果应该挺常用的，索性就整理一下了。

思路

分析了一下效果图，其实里面主要就三个主要元素，一个白色的半透明的背景圆环，姑且称之为A吧，一个橘黄色的进度圆环，称之为B，一个现实百分比的label。圆环可以结合CAShapeLayer和UIBezierPath进行绘制，那么整过过程就很简单了。关于CAShapeLayer官方的API可以查看这里。

过程

为了方便我把画笔的宽度，开始和结束的位置，背景颜色定义了宏，如下图

首先我们需要创建半透明白色背景的圆环A，代码如下：

1
2
3
4
5
6
7
8
9
10
11
12

//创建背景
- (void)initBackgroundView
{
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path addArcWithCenter:center radius:radius startAngle:ChartStart endAngle:ChartEnd clockwise:YES];
    bgCircleLayer = [CAShapeLayer layer];
    bgCircleLayer.path = path.CGPath;
    bgCircleLayer.fillColor = [UIColor clearColor].CGColor;
    bgCircleLayer.strokeColor = BackGroundColor.CGColor;
    bgCircleLayer.lineWidth = ChartWidth;
    [self.layer addSublayer:bgCircleLayer];
}

为了每次方便地设置环形进度，我们在.h文件中提供了一个方法：

1

- (void)setProgress:(double)value animated:(BOOL)animate;

具体的实现如下：

1
2
3
4
5
6
7
8
9
10
11

- (void)setProgress:(double)value animated:(BOOL)animate
{
    NSAssert(value < 1 && value > 0, @"value是包含0、1之间的数值");
    progress = value;
    animated = animate;
    radian = value * (2* M_PI - fabs(ChartStart - ChartEnd));
    self.percentLB.text = [NSString stringWithFormat:@"%.0f%%",progress*100];
    self.percentLB.center = [self percentCenter];
    //创建环形进度
    [self creatCircleLayer];
}

创建环形进度的方法- (void)creatCircleLayer其实和环形的背景一样的，这里就不再贴代码了。

然后就是解决环形进度动画的问题了

3D Touch是iOS 9的新特性，趁着6s到手了，赶紧体验了一把，确实方便了不少，今天我就简单的介绍一下。

简单的说3D Touch就是通过区分轻按和重按来进行不同的用户交互。Xcode 7才支持3D Touch的开发，但是这个手势并不支持模拟器，还好在github上找到了一个插件，可以在模拟器上模拟3D Touch的功能。插件的使用在github有上明确的教程，这里就不叙述了。

在苹果的开发者官网上我们可以3D Touch的链接：https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/Adopting3DTouchOniPhone/

介绍

3D Touch的主要应用分为三个模块：

1、 Home Screen Quick Actions

通过主屏幕的应用icon，我们可以用3D Touch呼出一个菜单，进行快速定位应用功能模块相关功能的开发。比如下图中的邮件：

2.Peek and Pop

这个功能是一套全新的用户交互机制，在使用3D Touch时，我们可以预览下一个页面的视图，并且可以进行简单的操作。如下图：

3.Force Properties

iOS9为我们提供了一个新的交互参数:力度。我们可以检测某一交互的力度值，来做相应的交互处理。例如，我们可以通过力度来控制快进的快慢，音量增加的快慢等。