Grunderna i ritning med 2-D-grafik i iOS App

Grunderna för ritning med 2-D-grafik i IOS App-dummies

Använda de inbyggda kontrollerna för att definiera din iOS-app är användargränssnittet roligt och enkelt. Det finns dock ett grundläggande sätt att dra ditt användargränssnitt i en vy med hjälp av ramkonfigurationen iOS Quartz Graphics, som ger dig 2-D-grafikfunktioner, som illustreras i ritningen av Tic-Tac-Toe-kortet.

För att se ett exempel på hur du använder 2-D-grafik, se styrklassen (filer TTTBoard. M och. H). Gränssnittsfilen i styrklassen visas här:

 @interface TTTBoard: UIView {...} ... -d 

Observera att DrawRect-metoden är överraderad på basen Visa klass, som visas här:

 // Ritningskod - ) drawRect: (CGRect) rect {int gridSize = TTTBOARDSIZE; UIBezierPath * drawingPath = [UIBezierPath bezierPath]; // rita vertikala linjer för (int i = 0; i <= 3; i ++) {int x = TTTBOARDLOCATIONINVIEWX + [self getWidth] * i; [drawingPath moveToPoint: CGPointMake (x, TTTBOARDLOCATIONINVIEWY)]; [drawingPath addLineToPoint: CGPointMake (x, TTTBOARDLOCATIONINVIEWY + gridSize)];} // rita horisontella linjer för (int j = 0; j <= 3; j ++) {int y = TTTBOARDLOCATIONINVIEWY + j * [self getHeight]; [drawingPath moveToPoint: CGPointMake (TTTBOARDLOCATIONINVIEWX, y)]; [drawingPath addLineToPoint: CGPointMake (TTTBOARDLOCATIONINVIEWX + gridSize, y)];} [[UIColor redColor] setStroke]; [drawingPath stroke]; // Rita symbolerna float offsetX = 0; float offsetY = 0; för (int i = 0; i 

Linjerna som är relevanta för 2-D-grafritning extraheras från metoden, som visas här:

 UIBezierPath * drawingPath = [UIBezierPath bezierPath]; ... [drawingPath moveToPoint: CGPointMake (TTTBOARDLOCATIONINVIEWX, y)]; [drawingPath addLineToPoint: CGPointMake (TTTBOARDLOCATIONINVIEWX + gridSize, y)]; ... [[UIColor redColor] setStroke]; [drawingPath stroke]; ... [imageSelected drawAtPoint: CGPointMake (offsetX, offsetY)]; 

För det första kan UIBezierPath-klassen definiera en sökväg bestående av linjesegment. Metoderna som används här för att lägga till linjesegment är moveToPoint och addLineToPoint. Därefter ställs penens färg in med setStroke; sedan görs linjen med hjälp av metodslaget.Slutligen, det sista uttalandet - [imageSelected drawAtPoint: CGPointMake (offsetX, offsetY)]; - ritar en bild (i det här fallet någon av symbolerna Tic-Tac-Toe, inklusive den tomma symbolen) på rutnätet.