UMImage resizableImageWithCapInsets: nie działa zgodnie z oczekiwaniami

Piszę moją pierwszą aplikację na iOS kierowaną na platformę iOS 5.0+. Używam protokołu UIAppearance do dostosowania interfejsu użytkownika aplikacji.UMImage resizableImageWithCapInsets: nie działa zgodnie z oczekiwaniami

Próbuję zmienić tło dla UIBarButtonItem w całej aplikacji. Z uwagi na to, że mój UIBarButtonItem może zmieniać rozmiar w zależności od użytego tekstu lub ikony, próbuję użyć UIImage resizableImageWithCapInsets: z moim tłem png.

Pierwotnie znalazłem kod, który potrzebowałem na Ray Wenderlich. Używając tego samego kodu, z obrazem, który jest bardzo podobny do tego użytego we wspomnianym samouczku, uzyskuję dziwne wyniki. Może to tylko mój brak doświadczenia z Cocoa Touch.

Oto kod, którego używam.

DreamsAppDelegate.m - customizeAppearance:

UIImage *btnBg = [[UIImage imageNamed:@"navBarButton-bg"] 
      resizableImageWithCapInsets:UIEdgeInsetsMake(0, 6, 0, 6)]; 

[[UIBarButtonItem appearance] setBackgroundImage:btnBg 
             forState:UIControlStateNormal 
             barMetrics:UIBarMetricsDefault];

Oto obraz png tło Próbuję użyć

png background

A oto wynik (w symulatorze)

result of trying to use resizableImageWithCapInsets:

Źródło

2012-04-25 Brandon Cordell

Sekcja obrazu pomiędzy left i right, a między top i bottom, jest układana w postaci kafelków w celu wypełnienia wymaganej przez obraz przestrzeni. Wypróbuj UIEdgeInsetsMake(15, 6, 15, 6).

Aby uogólnić, jeśli obraz ma ciągły gradient, powtarzająca się sekcja powinna mieć wysokość tylko 1 piksela. Ponieważ obraz przycisku ma 31 pikseli wysokości, top i bottom (pierwszy i trzeci argument do UIEdgeInsetsMake) powinny dodać do 30. Nie muszą być równe; UIEdgeInsetsMake(8, 6, 22, 6) spowoduje przesunięcie powtarzanej sekcji w górę, co spowoduje jaśniejsze tło.

Co więcej, czy plik jest załączony jako zwykła lub siatkówkowa ("@ 2x") wersja obrazu? Wypustki muszą być w rozmiarze wersji gładkiej.

Źródło

2012-04-25 03:58:50 Dondragmer

Dzięki za odpowiedź. Zamieszczony obraz jest @ 2x. Więc powinienem wyciąć mi pomiary na (0, 3, 0, 3)? Mówisz, że powinienem zrobić środek mojego obrazu o szerokości 1px? Rozumiem, dlaczego tak się stało, ale samouczek, którego używałam, miał obraz o wymiarach 30 na 40 pikseli, z tym samym gradientem stylu co ja i wydaje mi się, że działa fantastycznie (z UIEdgeInsetsMake, którego teraz używam, dostosowany po pikselu z powodu moich promieni narożnych). –

Oto sztuczka: możesz użyć 0 dla górnego i dolnego pola _if_ twój obraz tła ma taką samą wysokość jak przycisk paska nawigacji.Po prostu wypełnia to miejsce istniejącym gradientem. Twój obraz nie ma wysokości przycisku nawigacyjnego siatkówki, dlatego będzie rozciągany lub powtarzany w celu wypełnienia tej wysokości. Musisz podać rozmiar górnej i dolnej czapki (pierwszy i trzeci argument). Zacznij od '(7, 3, 7, 3)'. To pozostawi trochę pasków, ale miejmy nadzieję, że lepiej zrozumie, co się dzieje. – Dondragmer

Ahh, to ma trochę więcej sensu. Jaki jest rozmiar przycisku siatkówki siatkówki? Planuję elementy interfejsu użytkownika z pliku PSD o rozmiarze siatkówki, więc jeśli muszę zrobić przycisk navBar bg większy na pliku psd i wyeksportować go, aby uzyskać to, czego potrzebuję, to będzie to dla mnie łatwe. –

Mam dokładnie ten sam problem.

Inną rzeczą, którą możesz zrobić, to ustawić parametr resizingMode w UIImageResizingModeStretch. Rozwiązał mój problem.

Hopwever, nie jest dostępny w IOS5. Więc moim rozwiązaniem byłoby zrobić tak, jak mówili wszyscy inni. Uświadom sobie, że strona taflowa powinna być tylko jednym pikselem. Większość przycisków i tak nie zmienia się zbytnio w środku.

Tak, użyj tego kodu:

-(UIImage *) resizableImageWithCapInsets2: (UIEdgeInsets) inset 
    { 
     if ([self respondsToSelector:@selector(resizableImageWithCapInsets:resizingMode:)]) 
     { 
      return [self resizableImageWithCapInsets:inset resizingMode:UIImageResizingModeStretch]; 
     } 
     else 
     { 
      float left = (self.size.width-2)/2;//The middle points rarely vary anyway 
      float top = (self.size.height-2)/2; 
      return [self stretchableImageWithLeftCapWidth:left topCapHeight:top]; 
     } 
    }

Źródło

2012-10-17 14:14:25

Dziękujemy za poświęcenie czasu na odpowiedź, mimo że jest to starszy wpis. Bardzo doceniane! –

Inne odpowiedzi w rzeczywistości nie rozwiązują problemu. Dzięki. –

Dzięki! Sprawdziło się doskonale dla mnie. –

UMImage resizableImageWithCapInsets: nie działa zgodnie z oczekiwaniami

Odpowiedz

Powiązane problemy