Mam prosty widok (lewa strona obrazu) i potrzebuję stworzyć jakąś nakładkę (prawa strona obrazu) do tego widoku. Ta nakładka powinna mieć trochę nieprzezroczystości, więc poniższy widok jest nadal częściowo widoczny. Co najważniejsze, ta nakładka powinna mieć okrągły otwór pośrodku, aby nie nakładała się na środek widoku (patrz rysunek poniżej).
Mogę łatwo utworzyć taki krąg:
int radius = 20; //whatever
CAShapeLayer *circle = [CAShapeLayer layer];
circle.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0,radius,radius) cornerRadius:radius].CGPath;
circle.position = CGPointMake(CGRectGetMidX(view.frame)-radius,
CGRectGetMidY(view.frame)-radius);
circle.fillColor = [UIColor clearColor].CGColor;
Oraz „pełną” prostokątną nakładkę, taką jak ta:
CAShapeLayer *shadow = [CAShapeLayer layer];
shadow.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, view.bounds.size.width, view.bounds.size.height) cornerRadius:0].CGPath;
shadow.position = CGPointMake(0, 0);
shadow.fillColor = [UIColor grayColor].CGColor;
shadow.lineWidth = 0;
shadow.opacity = 0.5;
[view.layer addSublayer:shadow];
Ale nie mam pojęcia, jak mogę połączyć te dwie warstwy, aby uzyskać efekt, który chcę. Ktoś? Naprawdę próbowałem wszystkiego ... Wielkie dzięki za pomoc!
ios
objective-c
calayer
quartz-core
animal_chin
źródło
źródło
moveToPoint
następnie dodaj prostokąt zaokrąglony. Sprawdź w dokumentacji metody oferowane przezUIBezierPath
.Odpowiedzi:
Udało mi się to rozwiązać dzięki sugestii Jona Steinmetza. Jeśli kogoś to obchodzi, oto ostateczne rozwiązanie:
Swift 3.x:
Swift 4.2 i 5:
źródło
Aby stworzyć ten efekt, najłatwiej było utworzyć cały widok nakładający się na ekran, a następnie odjąć części ekranu za pomocą warstw i UIBezierPaths. Szybkie wdrożenie:
Przetestowałem powyższy kod i oto wynik:
Dodałem bibliotekę do CocoaPods, która usuwa wiele z powyższego kodu i umożliwia łatwe tworzenie nakładek z prostokątnymi / okrągłymi otworami, umożliwiając użytkownikowi interakcję z widokami za nakładką. Użyłem go do stworzenia tego samouczka dla jednej z naszych aplikacji:
Biblioteka nazywa się TAOverlayView i jest open source pod Apache 2.0. Mam nadzieję, że okażą się przydatne!
źródło
Zaakceptowane rozwiązanie zgodne ze Swift 3.0
źródło
Przyjąłem podobne podejście jak animal_chin, ale jestem bardziej wizualny, więc większość z nich ustawiłem w Interface Builder za pomocą gniazd i automatycznego układu.
Oto moje rozwiązanie w Swift
źródło
Kompatybilny z Code Swift 2.0
Zaczynając od odpowiedzi @animal_inch, koduję małą klasę użytkową, mam nadzieję, że to doceni:
Następnie, gdziekolwiek w kodzie:
źródło