Storyboard-的基本使用

通过 Storyboard ID 加载控制器

给 ViewController 设置 Storyboard ID

storyboardID.png

UIViewController *vc = [[UIStoryboard storyboardWithName:@"Test" bundle:nil]instantiateViewControllerWithIdentifier:@"StoryboardID"];

Test为 vc 所在的 Storyboard 文件的名字。

直接实例化初始控制器

如果给 ViewController 勾选了 is Initial View Controller选项,则可以直接实例化。

initialVC.png

UIViewController *vc2 = [[UIStoryboard storyboardWithName:@"Test" bundle:nil]instantiateInitialViewController];

Show 和 Show Detail

ShowShow Detail 两种 Segue 的视图切换模式分别对应pushViewControllerpresentViewController

ShowSegue.gif

Manual Show 和 Manual Show Detail

Manual ShowManual Show Detail 的视图切换模式和 ShowShow Detail 一样,只不过需要使用代码触发。

ManualShowSegue.gif

连线完成之后,要想通过代码触发 Segue,还需要给 Segue 设置Identifier。

SegueIdentifier.png

通过代码触发 Segue。

[self performSegueWithIdentifier:@"ManualSegue" sender:nil];

创建 Manual Show 的 Segue时,是选中 ViewController 来进行连线。

自定义切换效果

实现自定义切换效果有很多种方法,但这里介绍的是通过自定义 Segue 来实现。

创建 一个 UIStoryboardSegue 的子类并覆盖 perform 方法。

@implementation CustomSegue

- (void)perform
{
    UIViewController *src = self.sourceViewController;
    UIViewController *dest = self.destinationViewController;

    CGRect srcFrame = src.view.frame;
    CGRect originalSourceRect = src.view.frame;

    CGFloat viewWidth = srcFrame.size.width;
    CGFloat viewHeight = srcFrame.size.height;

    dest.view.alpha = 0.0f;
    dest.view.frame = CGRectMake(viewWidth, 0, viewWidth, viewHeight);
    [[src.view superview] addSubview:dest.view];

    [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.3 initialSpringVelocity:0.5 options:UIViewAnimationOptionCurveEaseInOut animations:^{

        CGRect srcEndFrame = CGRectMake(-viewWidth, 0, viewWidth, viewHeight);
        src.view.frame = srcEndFrame;
        src.view.alpha = 0;

        dest.view.frame = originalSourceRect;
        dest.view.alpha = 1.0f;

        dest.view.transform = CGAffineTransformIdentity;

    } completion:^(BOOL finished) {

        [dest.view removeFromSuperview];
        src.view.alpha = 1.0f;

        [src.navigationController pushViewController:dest animated:NO];

    }];
}

@end

修改 Segue 为 custom 类型,并将其 Class 改为自定义的类

CustomSegue.png

效果如下
CustomSegue.gif

传值

实现方法prepareForSegue: sender:,在控制器切换前会调用这个方法,然后可以在这个方法中进行传参。

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender
{
    if ([segue.identifier isEqualToString:@"identifier"]) {

        //拿到目标控制器
        UIViewController *desVC = segue.destinationViewController;
        //进行传参操作
    }
}

上面这个方法中还有一个参数 sender 咱们没用上,它是通过代码触发 Segue 的时候带过来的。

//将model传递过去,在 prepareForSegue: sender: 方法中可以获取到这个值。
[self performSegueWithIdentifier:@"identifier" sender:model];

常见的应用场景是,在 UITableView 的处理点击事件的代理方法中,将UITableViewCell 对应的数据模型传过去。

补充: 如果我们需要在某个条件下阻止一个 Segue 的触发,可以通过实现方法 shouldPerformSegueWithIdentifier: sender:来达到目的。不过需要注意的是,如果通过代码来触发 Segue,这个方法将起不到拦截作用

- (BOOL)shouldPerformSegueWithIdentifier:(NSString *)identifier sender:(id)sender
{
    if ([identifier isEqualToString:@"identifier"]) {
        return NO;
    }
    return YES;
}

Static Cells

在 Storyboard 中可以将 UITableView 的 Content 设置为 Static Cells,不过仅允许在 UITableViewController 中使用, 适用于 cell 的数量少、且数量固定,内容不会发生较大的变化的场景,比如 APP 内的设置界面。使用 Static Cells 我们就不需要再写一堆数据源、代理方法了,能够达到非常方便且快速搭建 UI 的目的。

StaticCells.png

一般情况下,我们处理 Cell 的点击事件是在 UITableView 的代理方法中通过 indexPath 来判断是点击了哪个 Cell,再来做处理。但是如果是一些比较简单的界面,跳转逻辑也很简单,那使用 Storyboard 会相对更简单(其实是懒得写代码,不需要实现代理方法,更不用在代理方法中写视图切换代码。我们在 Storyboard 中可以为每一个 Static Cell 绑定一个 Segue,当点击 Cell时,会触发这个 Segue。

StoryboardStaticCell.gif

KVC

我们可以通过代码使用 KVC 的方式来修改对象的属性值

[self.view setValue:@10 forKeyPath:@"layer.cornerRadius"];

其实在 Storyboard 中也是可以使用 KVC 的。一个简单的应用场景就是,在 Storyboard 中拖了一个控件,需要将它设置为圆角,但是又不想连线到.m文件中,这个时候就可以使用 KVC。

KVC.png

字符串换行

最后分享一个小技巧:在 Storyboard 或者 XIB 中,如果想让一个字符串多行显示,直接回车或者输入\n是不管用的,我们可以使用option + enter组合键来换行。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
DotNet UI 设计教程涵盖了许多方面,从基本的控件使用到高级的自定义控件和动画效果。以下是一些你可以参考的资源: 1. 官方文档和教程:微软官方网站上提供了大量的文档和教程,可以帮助你快速入门 DotNet UI 设计。你可以从这里开始:https://docs.microsoft.com/en-us/dotnet/framework/winforms/ 2. WPF 教程:如果你想深入学习 DotNet UI 设计,WPF(Windows Presentation Foundation)是一个很好的选择。WPF 提供了更高级的界面设计和数据绑定功能,可以帮助你创建复杂的用户界面。这里是一些 WPF 教程的链接: - https://www.wpf-tutorial.com/ - https://www.tutorialspoint.com/wpf/index.htm - https://www.c-sharpcorner.com/technologies/wpf-tutorials 3. 自定义控件教程:如果你想创建自定义控件,可以参考以下教程: - https://www.codeproject.com/Articles/38501/WPF-Tutorial-Part-Creating-own-control - https://www.c-sharpcorner.com/UploadFile/mahesh/custom-controls-in-wpf/ - https://www.tutorialspoint.com/wpf/wpf_custom_controls.htm 4. 动画效果教程:为了让你的用户界面更加生动,你可以使用动画效果。以下是一些动画效果教程的链接: - https://www.c-sharpcorner.com/article/wpf-animation-using-storyboard/ - https://www.tutorialspoint.com/wpf/wpf_animations.htm - https://www.wpf-tutorial.com/animations/creating-a-doubleanimation/ 希望这些资源可以帮助你开始学习 DotNet UI 设计!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值