¿Cómo construirías e interactuarías con una grilla como una placa Sudoku?

Question

¿Cuál cree que es la mejor manera de implementar una cuadrícula interactiva similar a una placa Sudoku para una aplicación de iPhone nativa? No vi un objeto para llenar esta necesidad en el SDK.

¿Debo hacer un control personalizado para una celda individual, y luego inicializar tantas de ellas como lo necesite en forma de cuadrícula?

Sudoku grid http://www.sudoku.4thewww.com/Grids/grid.jpg

Cualquiera y todos los comentarios son bienvenidos. Gracias!

Answer 1

La cuadrícula es un medio de ver contenidos, no de almacenar la representación. En última instancia, su cuadrícula está compuesta de celdas que tienen contenido y, por lo tanto, su objeto modelo subyacente tal vez sea mejor representado por la celda. Hay varias maneras de diseñar el almacenamiento subyacente para un juego de Sudoku y el desafío más grande seguramente estará en la generación de acertijos. Sin embargo, el consejo que debe tomar es no determinar su modelo en función de cómo aparece en la pantalla: la capa de visualización está totalmente separada, por lo que sería una mala idea hacer algo así como almacenarla en una matriz bidimensional.

Answer 2

Puede hacer esto con UIViews o CALayers como subvistas de la supervista principal. Necesitará al menos 81 de ellos (uno para cada número en la grilla de Sudoku). Las capas son más livianas y requieren menos recursos, pero las vistas tienen un poco más de funcionalidad. Lo que elija depende de lo que está tratando de hacer.

Answer 3

Hubo un artículo en algún lugar sobre cómo implementar un solucionador de Sudoku. Creo que utiliza una estructura de datos como esta:

• una cuadrícula tiene 81 células
• una célula tiene tres pertenencias a grupos: una columna, una fila, y una caja
• un grupo tiene 9 células (referencias)

una célula tiene algunas propiedades más, dependiendo de lo que quiere hacer con la estructura:

• un valor
• una bandera hidden (para un juego)
• un conjunto de posibles valores (para un solucionador)

Answer 4

Para una cuadrícula tal completamente uniforme, crearía una subclase de UIView y tienen que determinar qué fila y la columna de usuario ha tocado el uso de un simple cálculo:

int touchedRow = 9 * touch.x/[self bounds].width; 
int touchedCol = 9 * touch.y/[self bounds].width;

no veo mucho beneficio en la creación de 81 objetos individuales en la memoria, cuando bastaría un solo objeto.

Answer 5

He estado jugando con un juego de Sudoku antes y hice las líneas de la grilla y el dibujo de los números en una sola vista. No por restricciones de memoria (usar un solo control y una memoria de celda reutilizable no debería ser una gran preocupación), sino porque solo se necesitan algunos cálculos simples para descubrir las ubicaciones de la grilla y los números, y programar una vista va a ser más fácil al principio. Si más tarde en la carretera comienza a sentirse abrumado con la cantidad de código de dibujo y manejo de eventos en su clase de vista, es posible que desee hacer un objeto de celda reutilizable que hace gran parte del trabajo, similar a UITableView.

La animación principal ciertamente funcionaría aquí también, si necesita animación o no. Un tablero de Sudoku probablemente no tendría mucha animación, pero si lo haces (¿tal vez una caja deslizante de 'selección'?) Esta podría ser la mejor opción.

Answer 6

Yo uso this code (source: this blog) TODO el momento. Es una gran "entrada" a la diversión y las desventuras de hacer cuadrículas. Combino esto con un algoritmo que mira el número de objetos "deseado" y el "marco" disponible, y me dice el mejor número de columnas/filas. Piense módulo .. int % int ...

- (void)awakeFromNib { 
    self.wantsLayer = YES; 
    CALayer *grid = self.layer; 
    grid.backgroundColor = CGColorCreateGenericRGB(0.1, 0.1, 0.4, .8); 
    grid.layoutManager = [CAConstraintLayoutManager layoutManager]; 
    int rows = 8; int columns = 8; 
    for (int r = 0; r < rows; r++) { 
     for (int c = 0; c < columns; c++) { 
      CALayer *cell = [CALayer layer]; 
      cell.borderColor = CGColorCreateGenericGray(0.8, 0.8); 
      cell.borderWidth = 1; cell.cornerRadius = 4; 
      cell.name = [NSString stringWithFormat:@"%u@%u", c, r]; 
      [cell addConstraint: 
      [CAConstraint constraintWithAttribute: kCAConstraintWidth 
       relativeTo: @"superlayer" 
       attribute: kCAConstraintWidth 
       scale: 1.0/columns offset: 0]]; 
      [cell addConstraint: 
      [CAConstraint constraintWithAttribute: kCAConstraintHeight 
       relativeTo: @"superlayer" 
       attribute: kCAConstraintHeight 
       scale: 1.0/rows offset: 0]]; 
      [cell addConstraint: 
      [CAConstraint constraintWithAttribute: kCAConstraintMinX 
       relativeTo: @"superlayer" 
       attribute: kCAConstraintMaxX 
       scale: c/(float)columns offset: 0]]; 
      [cell addConstraint: 
      [CAConstraint constraintWithAttribute: kCAConstraintMinY 
       relativeTo: @"superlayer" 
       attribute: kCAConstraintMaxY 
       scale: r/(float)rows offset: 0]]; 
     [grid addSublayer:cell]; 
} } } 

Answer 7

Es muy Simple.I uso GridView como clase UIViewController y agregue el código siguiente en gridView.m

#import "SudokuClass.h" 
#import "GridView.h" 

@interface GridView() 

@end 

@implementation GridView 


-(void)createNumberButton { 

    int cellWidth = 34; 
    int cellHeight = 34; 
    int xSta = 7 - cellWidth; 
    int ySta = 50 - cellHeight; 
    //NSMutableDictionary *buttonTable = [[NSMutableDictionary alloc] initWithCapacity:81]; 
    for (int i = 1; i < 10; i++) { 
     xSta = xSta + cellWidth; 
     for (int j = 1 ; j < 10; j++) { 
      ySta = ySta + cellHeight; 
      CGRect pos = CGRectMake(xSta, ySta, cellWidth, cellHeight); 
      UIButton *b = [SudokuClass createSudokuButtonForView:self atPos:pos 
                  withTag:j*10+i forAction:@selector(numButtonPressed:)]; 
      NSString *picName = @"ButtonPic.jpg"; 
      [b setBackgroundImage:[[UIImage imageNamed:picName] stretchableImageWithLeftCapWidth:0 topCapHeight:0] forState:0]; 
      [self.view addSubview:b]; 
      //[numButtons addObject:b]; 
     } 
     ySta = 50 - cellHeight; 
    }} 
-(void)viewDidLoad 
{ 

    [self createNumberButton]; 
    [super viewDidLoad]; 
} 
@end 

aquí es mi clase de sudoku clase nsobject con el método

+(UIButton *)createSudokuButtonForView:(UIViewController *)view atPos:(CGRect)position withTag:(int)tag forAction:(SEL)action { 
UIButton *b = [UIButton buttonWithType:UIButtonTypeCustom]; 
[b setFrame:position]; 
[b.titleLabel setFont:[UIFont boldSystemFontOfSize:15]]; 
[b setTag:tag]; 
[b addTarget:view action:action forControlEvents:UIControlEventTouchDown]; 
[b setTitle:@"" forState:0]; 
[b setTitleColor:[UIColor blackColor] forState:0]; 
//b.layer.frame = CGRectMake(xSta-1, ySta-1, 31, 31); 
//[b.layer setBorderWidth:borderWidth]; 


b.userInteractionEnabled = YES; 
return b;} 

hope anyone f ind it useful .. :)