美文网首页
iWatch动态改变UI元素位置和大小

iWatch动态改变UI元素位置和大小

作者: Dosun | 来源:发表于2017-03-13 18:15 被阅读303次

Watch OS 2.0支持动态改变UI元素位置和大小,可以让iWatch 界面更丰富,本文将讲述其简单的用法。

一、常用属性和方法


WK_CLASS_AVAILABLE_IOS(8_2)
@interface WKInterfaceObject : NSObject

//初始化方法,建议不要使用!
- (instancetype)init NS_UNAVAILABLE;

//隐藏控件
- (void)setHidden:(BOOL)hidden;

//设置透明度
- (void)setAlpha:(CGFloat)alpha;

//设置水平对齐
- (void)setHorizontalAlignment:(WKInterfaceObjectHorizontalAlignment)horizontalAlignment WK_AVAILABLE_WATCHOS_ONLY(2.0);

//设置竖直对齐
- (void)setVerticalAlignment:(WKInterfaceObjectVerticalAlignment)verticalAlignment WK_AVAILABLE_WATCHOS_ONLY(2.0);

//设置宽度
- (void)setWidth:(CGFloat)width;

//设置其高度
- (void)setHeight:(CGFloat)height;

//相对其父类 设置宽度
- (void)setRelativeWidth:(CGFloat)width withAdjustment:(CGFloat)adjustment WK_AVAILABLE_WATCHOS_ONLY(2.0);

//相对其父类 设置高度
- (void)setRelativeHeight:(CGFloat)height withAdjustment:(CGFloat)adjustment WK_AVAILABLE_WATCHOS_ONLY(2.0);

//自适应改变宽度
- (void)sizeToFitWidth WK_AVAILABLE_WATCHOS_ONLY(2.0);

//自适应改变高度
- (void)sizeToFitHeight WK_AVAILABLE_WATCHOS_ONLY(2.0);

@end


二、常用的用法

2.1 其效果图如下
动态修改控件.gif
2.2 其storyboard布局如下图所示
Snip20170313_63.png
2.3 代码如下,其注释都已标明


@interface InterfaceController()

//图片
@property (unsafe_unretained, nonatomic) IBOutlet WKInterfaceImage *imageView;

//按扭 该按扭是隐藏的
@property (unsafe_unretained, nonatomic) IBOutlet WKInterfaceButton *btn;
@end

@implementation InterfaceController

#pragma mark - 按钮点击事件
- (IBAction)clickBtn
{
    //动画  时长为1.0秒
    [self animateWithDuration:2.0 animations:^{
        //设置图片的宽度为100
        [self.imageView setWidth:100];
        
        //取消隐藏按钮
        [self.btn setHidden:NO];
        
        //设置按钮宽度
        [self.btn  setWidth:100];
        
        //设置按钮水平  位于父控件的中心
        [_btn setHorizontalAlignment:WKInterfaceObjectHorizontalAlignmentCenter];
        
        //设置按钮竖直  位于父控件的中心
        [_btn setVerticalAlignment:WKInterfaceObjectVerticalAlignmentCenter];
        
    }];

}
@end

以上是iWatch动态改变UI元素位置和大小用法,有不足之处,请指出,感谢!

相关文章

  • iWatch动态改变UI元素位置和大小

    Watch OS 2.0支持动态改变UI元素位置和大小,可以让iWatch 界面更丰富,本文将讲述其简单的用法。 ...

  • 元素偏移量,元素可视区,元素滚动

    概述 使用offset系列相关属性可以动态获得元素的位置和大小 获得元素距离带有定位的父元素的位置 获得元素自身大...

  • css布局

    1.固定布局:浏览器大小改变,元素大小位置均不变 2.流体布局(自适应布局):浏览器大小改变,元素位置不变大小改变...

  • JavaScript -- 元素大小和位置

    在 JavaScript 操作 DOM 的过程中我们可能需要经常获取一个元素的大小,在处理鼠标事件的时候可能需要知...

  • 网页特效

    元素偏移量offset系列 动态获取元素的偏移 获取元素距离带有定位父元素的位置 获取元素的自身大小 返回的数值都...

  • Unity进阶技巧 - RectTransform详解

    前言 最近要做UI,有时候需要在代码中调整改变UI控件的属性,比如位置、大小等,然而在NGUI里面,控制UI控件的...

  • PC端网页特效

    一、元素偏移量offset系列 使用offset系列相关属性可以动态的得到该元素的位置(偏移)、大小等。返回值都不...

  • jQuery篇之操作jQuery对象(样式)

    获取/设置 元素内容 获取/设置 元素属性 获取/设置 元素样式 获取/设置 元素位置和大小

  • UGUI - RectTransform详解

    RectTransform属性一览 前言 最近要做UI,有时候需要在代码中调整改变UI控件的属性,比如位置、大小等...

  • DOM的回流和重绘Repaint&Reflow

    重绘: 元素的样式改变(但宽高、大小、位置不变) 如outline,visibility,color,backgr...

网友评论

      本文标题:iWatch动态改变UI元素位置和大小

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