美文网首页
IOS 中的 VFL

IOS 中的 VFL

作者: 橙园大菜 | 来源:发表于2016-08-06 20:12 被阅读127次

    VFL 介绍

    Visual Format Language 可视化格式语言

    是苹果公司为了简化Autolayout的编码而推出的抽象语言

    VFL 语法

    H: 水平方向

    V: 垂直方向

    | 边界

    [ 视图名称 ]

    ( 常数值 )

    == >= <= 关系

    - 距离

    VFL 示例

       H:|-0-[button]-0-|

       按钮 距离 左右 两边为 0

       V:|-0-[button]-0-|

       按钮 距离 上下 两边为 0

       H:|-20-[button(50)]

       按钮 距离 左 边 20

       按钮宽度 50

       V:[button(40)]-20-|

       按钮 距离 底 边 20

       按钮高度 40

      VFL 没有提供居中对齐的方式,也不支持运算符

    03-VFL代码演练

    需求:

    定义两个 UITextField 水平距离左右两边 20 点

    第一个 UITextField 垂直距离顶边 20 点

    第二个 UITextField 垂直距离第一个 20 点

    textField需要设置边框

    VFL没有默认边距"间距"

    views字典 - 建立VFL中的名字和控件的关系

    @implementation ViewController

    - (void)viewDidLoad {

             [super viewDidLoad];

            UITextField *text1 = [[UITextField alloc] init];

    #warning mark - 用代码创建文本输入框时一定要注意给它设置边框样式

               text1.borderStyle = UITextBorderStyleRoundedRect;

    //        text1.frame = CGRectMake(100, 100, 100, 30);

               [self.view addSubview:text1];

               UITextField *text2 = [[UITextField alloc] init];

    #warning mark - 用代码创建文本输入框时一定要注意给它设置边框样式

               text2.borderStyle = UITextBorderStyleRoundedRect;

    //    text2.frame = CGRectMake(100, 200, 100, 30);

               [self.view addSubview:text2];

               text1.translatesAutoresizingMaskIntoConstraints = NO;

               text2.translatesAutoresizingMaskIntoConstraints = NO;

               NSDictionary *views = @{@"text1" : text1, @"text2" : text2};

               NSDictionary *metrics = @{@"leftMargin" : @20};    

    // 创建第一个文本框的水平方向约束

    NSArray *text1H = [NSLayoutConstraintconstraintsWithVisualFormat:@"H:|-leftMargin-[text1]-leftMargin-|" options:0 metrics:metrics views:views];

                  [self.view addConstraints:text1H];

    // 创建第二个文本框的水平方向约束

    NSArray *text2H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[text2]-20-|" options:0 metrics:nil views:views];

    [self.view addConstraints:text2H];

    // 创建垂直方向的约束

    NSArray *text1AndText2V = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[text1(50)]-20-[text2(==text1)]" options:0 metrics:nil views:views];

        [self.view addConstraints:text1AndText2V];

    相关文章

      网友评论

          本文标题:IOS 中的 VFL

          本文链接:https://www.haomeiwen.com/subject/mpnksttx.html