UIView

Introducere

UIView este o suprafaţă dreptunghiulară care conţine un sistem de coordonate, în care se poate desena şi care poate interpreta gesturi (pan, swipe, pinch etc.).

Cuprins

Căteva exemple de clase care moştenesc UIView: UILabel, UIButton, UIScrollView, UIImageView, etc.

În ceea ce priveşte organizarea View-urilor, un view are un singur superview, dar poate avea mai multe subview-uri.

  • View 2 şi View 3 sunt subview-uri ale lui View 1
  • View 1 este superview pentru View 2
  • View 2 este superview pentru View 3

Ordinea subview-urilor în array-ul cu subview-uri conteaza. Array-ul cu subview-uri poate fi văzut ca o stivă: ultimul view adăugat este cel vizibil.

UIView-urile pot fi adăugate în Storyboard prin drag-and-drop sau adăugate prin cod folosind metodele:

- (void)addSubview:(UIView *)aView;
- (void)removeFromSuperview;

Pentru a crea exemplu de mai sus din cod:

[view1 addSubview:view2];
[view2 addSubview:view3];
// Daca am dori scoaterea lui “view3” am scrie:
[view3 removeFromSuperview];
// Se poate observa ca pentru a scoate un view ii trimitem lui mesajul, nu superview-ului

Sistemul de coordonate dintr-un UIView

Punctul (0,0) al sistemului de coordonate este în colţul din stânga-sus al ecranului.

Unităţile sunt puncte (points) şi nu pixeli. Dacă nu se desenează ceva detaliat, nu ne interesează câţi pixeli sunt per punct. UIView are, însa, o proprietate care ne spune câţi pixeli are un punct:

@property CGFloat contentScaleFactor;

Câteva structuri utile atunci cand vrem sa desenam:

CGFloat – reprezinta un simplu float, dar îl vom folosi cand desenăm

CGPoint – conţine 2 GCFloat-uri: un x şi un y.

CGPoint p = CGPointMake(25.5,30.3);
NSLog(@"x = %d, y = %d",p.x,p.y);
//se va afisa in consola "x = 25.5, y = 30.3"

CGSize – conţine 2 CGFloat-uri: width şi height

CGSize s = CGSizeMake(100.5,200.4);
NSLog(@"width = %d, height = %d",s.width,s.height);
//se va afisa in consola "width = 100.5, height = 200.4"

CGRect – conţine un CGPoint origine şi un CGSize

CGRect dreptunghi = CGRectMake(45.0 , 54.6 , 100.4 , 120.5);
NSLog(@"dreptunghi x = %d, y = %d, width = %d, height = %d",dreptunghi.origin.x,dreptunghi.origin.y,dreptunghi.size.width,dreptunghi.size.height);
//se va afisa in consola "dreptunghi x = 45.0, y = 54.6, width = 100.4, height = 120.5"

Proprietăţi utile ale UIView-ului care ne ofera informaţii despre pozitionarea lui:

@property CGRect bounds;

- spaţiul intern în care se desenează

@property CGPoint center;

- centrul în spaţiul de coordonate al superview-ului

@property CGRect frame;

- CGRect în spatiul de coordonate al superview-ului care conţine în întregime bounds.size

Creare de UIView-uri

UIView-urile pot fi create prin drag and drop în Storyboard sau prin cod folosind “alloc” şi “initWithFrame:”.

CGRect imageRect = CGRectMake(100,100,50,50);
UIImageView *imageView = [[UIImageView alloc] initWithFrame:imageRect];
[self.view addSubview:imageView];

Exercitii

  • Realizati urmatoarea interfata grafica folosind Storyboard:

  • Realizati aceasi interfata folosind numai linii de cod:

  • In continuarea exercitiului anterior, adaugati o actiune pe buton: atunci cand se apasa butonul de login sa apara pe ecran un alt UIView care sa contina un label cu textul „You did it!“ daca parola este egala cu „parolaCorecta“. Daca nu este egala cu „parolaCorecta“ afisati un UIView care sa contina un label cu textul „Try again!“

BONUS:

  • Daca parola este introdusa gresit, oferiti sansa userului de a reintroduce parola. Adaugati un UIButton cu textul „Try again“ pe UIViewul ce afiseaza „Try again“.
  • Adaugati o actiune pe buton folosind linii de cod: atunci cand se apasa butonul sa dispara UIView-ul cu mesajul „Try again“ si sa revina la UIViewul cu log in.
programare_ios/curs/curs4.txt · Ultima modificare: 2013/07/28 16:38 de către bogdan.vlad
CC Attribution-Noncommercial-Share Alike 3.0 Unported
www.chimeric.de Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0