Wie erstelle ich ein Raster aus Symbolen wie auf dem iPhone-Startbildschirm?

Question

Wie sollte ich vorgehen, um eine Benutzeroberfläche ähnlich dem Springboard (Startbildschirm) auf dem iPhone zu erstellen? Ich möchte ein Raster von gleichmäßig verteilten Schaltflächen mit Bildern, wo ich auf die Schaltfläche tippen reagieren kann.

Ist der UITable eine gute Lösung? Sollte ich ein einfaches UIView verwenden und die Icons manuell in DrawRect positionieren? Gibt es eine Alternative, die die Schaltflächen automatisch gleichmäßig verteilt, eine Neuanordnung ermöglicht und das Layout entsprechend der iPhone-Ausrichtung anpasst?

Ich komme aus einem C#/Winforms-Hintergrund und beginne gerade erst mit der iPhone-Entwicklung auf der Open Toolchain mit 2.2.1 Headern.

Answer 1

Ich habe einen Beispielcode geschrieben, um so etwas zu tun. Siehe mein Kacheln Blogeintrag, oder laden Sie einfach den Code herunter: Kacheln-v1.0.zip .

Mein Code erstellt die Icons als Core Animation-Ebenen, nicht als UIViews, zeigt aber, wie man Taps erkennt und die Icons neu anordnen kann. Es behandelt keine Änderungen der Ausrichtung.

Answer 2

Altes Thema, aber Sie sollten sich Alan Quartrmain's AQGridView auch.

Answer 3

Sie müssen Ihre Symbole (die UIViews einer Art sind) als Unteransichten Ihrer "Sprungbrett"-Ansicht hinzufügen. Keine benutzerdefinierte Zeichnung benötigt, und ein UITable ist thh absolut falschen Weg zu gehen. Sie müssen nur die Mathematik zu tun, um sie richtig zu platzieren (durch die Einstellung ihrer Rahmen).

Answer 4

@August: Ich habe deinen Rat befolgt und die UIButtons als Unteransichten der UIView hinzugefügt, anstatt weiter in die UITable zu schauen. Danke!

Hoffentlich hilft der unten stehende Code jemand anderem auf die Sprünge. Ich habe statisch 4 Schaltflächen in einem Raster platziert. Es sollte nicht viel schwieriger sein, eine beliebige Anzahl von Schaltflächen nach der übergeordneten UIView's Grenzen und Orientierung zu platzieren.

@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

Answer 5

Verwenden Sie die gridView-Implementierung von Arijasoft. Es handelt sich um eine statische Bibliothek, mit der Sie den Gittertyp der Ansicht mit Rückrufen und Delegatmethoden zur Optimierung generieren können