问题 如何创建iPhone主屏幕等图标网格?


我应该如何在iPhone上创建类似于Springboard(主屏幕)的UI?我想要一个均匀间隔的按钮网格图像,我可以响应按钮。

UITable是否合适?我应该使用普通的UIView并在DrawRect中手动定位图标吗?是否有替代方案可以自动均匀分隔按钮,允许重新组织,并根据iPhone方向调整布局?

我来自C#/ Winforms背景,我刚刚开始使用2.2.1标题在Open Toolchain上进行iPhone开发。


8122
2018-02-03 17:48


起源

也许你应该提供更多的域名信息。并且还使用您用于开发的框架标记问题。 - Slavo
“域名信息”?喜欢...应用程序的目的?这将是一个图标网格,按下后,将播放声音。有哪些框架?我是新手,不知道所有的名字是什么。如何确定我使用的是哪个框架? - Nick VanderPyle


答案:


您需要添加图标(某些UIViews)作为“Springboard”视图的子视图。不需要自定义绘图,UITable是绝对错误的方法。您只需要进行数学计算以正确放置它们(通过设置它们的框架)。


2
2018-02-03 19:38



手动数学路线?我曾希望有一种更简单的方法。好吧。谢谢!我对UITable并不聪明。为什么不合适? - Nick VanderPyle
UITable非常适合列表。每个对象都在自己的行中。但是,UIView允许您布置自己的网格,并在任何地方使用视图。 - August
说得通。从.NET的角度来看,UITable更像是GridView而不是TableLayout。 - Nick VanderPyle
在iPhone上,UITableView只有一列。总是。所以它不适合网格。它更像是一个花哨的概述列表视图。 - Alex Wayne


我写了一些示例代码来做这样的事情。看我的 瓷砖 博客条目,或只是下载代码: Tiles-v1.0.zip

我的代码将图标创建为核心动画层,而不是UIViews,但确实演示了如何检测点击并允许重新组织图标。它不处理方向更改。


6
2018-02-06 04:46





老线程,但你应该看看Alan Quartrmain的 AQGridView 太。


4
2018-06-29 17:45



我已经好好看看AQGridView - 它似乎做了所有事情,并且它在一些商业应用程序中使用。决定反对它最终是因为(1)它是巨大的,许多令我困惑的代码,不是那么难吗?! (2)当我拖动图标时它撞到了我身上。将它与大型代码库相结合,您可以推断,当您可以编写自己的代码时,最终会花费大量时间修复其他人的代码。我喜欢AQGridView采用的方法 - 它基于带有委托和源的UITableView,以及可重用的单元格。但我会自己动手。 - n13


@August:我接受了你的建议并将UIButtons添加为UIView的子视图,而不是进一步了解UITable。谢谢!

希望下面的代码有助于快速启动其他人。我已经静态地在网格中放置了4个按钮。根据父UIView的界限和方向放置任意数量的按钮应该不会困难得多。

@implementation IconView
- (id)initWithFrame:(struct CGRect)windowRect{
  self = [super initWithFrame: windowRect];
  if (self != nil){
    for(int i = 0; i < 4; i++){
      buttons[i] = [self buildButton];
      [self addSubview: buttons[i]];
    }
    [self reInit];
  }
  return self;
}
- (UIButton *) buildButton{
  UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 60, 60)];
  [button setBackgroundImage: [[UIImage imageNamed:@"icon.png"] stretchableImageWithLeftCapWidth:60 topCapHeight:0] forState:UIControlStateNormal];
  return [button autorelease];
}
- (void)reInit{
  CGRect rect;
  rect = buttons[0].frame;
  rect.origin = CGPointMake(5, 5);
  buttons[0].frame = rect;

  rect = buttons[1].frame;
  rect.origin = CGPointMake(70, 5);
  buttons[1].frame = rect;

  rect = buttons[2].frame;
  rect.origin = CGPointMake(5, 70);
  buttons[2].frame = rect;

  rect = buttons[3].frame;
  rect.origin = CGPointMake(70, 70);
  buttons[3].frame = rect;
}
@end

1
2018-02-04 20:06



什么是“按钮”?你是如何得到UIButton的集合的? - George
UIButton只是一个带有一些额外方法的UIView。将示例更改为使用UIView而不是UIButton将是微不足道的。 - Kristopher Johnson


使用Arijasoft的gridView实现。它是一个静态库,允许您使用回调和委托方法生成网格类型的视图以进行优化


0
2018-01-23 10:50



这是一个商业图书馆吗?如果是这样,它需要多少钱? - Tim Sullivan
在他们说的网站上传的演示版本在最后一天工作到feb。如果您需要商业图书馆,请与他们联系 - Nareshkumar


如上所述使用UIView并进行数学布局视图是最简单的选择。

检查developer.apple.com的示例代码 https://developer.apple.com/library/ios/#samplecode/PageControl/Introduction/Intro.html#//apple_ref/doc/uid/DTS40007795

根据您的要求,您可能不需要使用任何外部框架。


0
2018-03-16 19:50