Jak zastosować transformację perspektywy do interfejsu UIView?

W tym celu należy wykonać transformację perspektywy na UIView (taką jak w coverflow)

Czy ktoś wie, czy jest to możliwe?

Zbadałem używając CALayer i przejrzałem wszystkie pragmatyczne podcasty animacji programisty Core, ale nadal Nie wiem, jak stworzyć tego rodzaju transformację na iPhonie.

Każda pomoc, wskazówki lub przykładowe fragmenty kodu będą naprawdę mile widziane!

Author: Brad Larson, 2008-12-07

4 answers

Jak powiedział Ben, musisz pracować z warstwą UIView, używając CATransform3D do wykonywania obrotu warstwy. Sztuczka, aby uzyskać pracę perspektywiczną, jak opisano tutaj {4]}, polega na bezpośrednim dostępie do jednej z komórek matrycy CATransform3D (M34). Matma nigdy nie była moją specjalnością, więc nie mogę dokładnie wyjaśnić, dlaczego to działa, ale tak jest. Należy ustawić tę wartość na ułamek ujemny dla początkowego przekształcenia, a następnie zastosować do niego zmiany obrotu warstwy. Ty powinno być również w stanie wykonać następujące czynności:

UIView *myView = [[self subviews] objectAtIndex:0];
CALayer *layer = myView.layer;
CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
rotationAndPerspectiveTransform.m34 = 1.0 / -500;
rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, 45.0f * M_PI / 180.0f, 0.0f, 1.0f, 0.0f);
layer.transform = rotationAndPerspectiveTransform;

Który odbudowuje transformację warstwy od podstaw dla każdego obrotu.

Pełny przykład tego (wraz z kodem) można znaleźć tutaj , gdzie zaimplementowałem obracanie i skalowanie dotykowe na kilku Calayerach, na przykładzie Billa Dudneya. Najnowsza wersja programu, na samym dole strony, realizuje tego rodzaju operacje perspektywiczne. Kod powinien być w miarę prosty do odczytania.

The sublayerTransform, do którego odwołujesz się w odpowiedzi, jest transformacją, która jest stosowana do sublayerów CALayer twojego UIView. Jeśli nie masz żadnych podlayerów, nie martw się o to. Używam sublayerTransform w moim przykładzie po prostu dlatego, że są dwie Kalwarie zawarte w jednej warstwie, którą obracam.

 321
Author: Brad Larson,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-06-21 14:04:57

Możesz używać tylko podstawowych przekształceń graficznych (Quartz, tylko 2D) bezpośrednio zastosowanych do Właściwości transform UIView. Aby uzyskać efekty w coverflow, musisz użyć CATransform3D, które są stosowane w przestrzeni 3-D, dzięki czemu możesz uzyskać pożądany widok perspektywiczny. CATransform3Ds można stosować tylko do warstw, a nie widoków, więc będziesz musiał przełączyć się na warstwy w tym celu.

Sprawdź próbkę "CovertFlow" dostarczaną z Xcode. To tylko mac (czyli nie dla iPhone ' a), ale wiele z koncepcje dobrze się przenoszą.

 7
Author: Ben Gottlieb,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2008-12-07 17:43:09

Aby dodać do odpowiedzi Brada i podać konkretny przykład, pożyczam z moją własną odpowiedź w innym poście na podobny temat. W mojej odpowiedzi stworzyłem prosty SWIFT playground, który można pobrać i pobawić się , gdzie demonstruję, jak tworzyć perspektywiczne efekty UIView z prostą hierarchią warstw, i pokazuję różne wyniki między użyciem transform i sublayerTransform. Zobacz też

Oto kilka zdjęć z postu:

 3
Author: HuaTham,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-04-13 19:03:45

Możesz uzyskać dokładny efekt karuzeli za pomocą iCarousel SDK.

Możesz uzyskać natychmiastowy efekt przepływu okładek na iOS za pomocą wspaniałej i darmowej biblioteki iCarousel. Możesz go pobrać z https://github.com/nicklockwood/iCarousel i dość łatwo wrzuć go do swojego projektu Xcode, dodając nagłówek pomostowy (jest napisany w Objective-C).

Jeśli nie dodałeś wcześniej kodu Objective-C do projektu Swift, wykonaj następujące kroki:

  • Pobierz iCarousel i unzip it
  • przejdź do folderu, który rozpakowałeś, otwórz jego podfolder iCarousel, a następnie wybierz iCarousel.h i iCarousel.m i przeciągnij je do nawigacji projektu – to lewy panel w Xcode. Poniżej Info.plist ma się dobrze.
  • zaznacz "Kopiuj elementy w razie potrzeby", a następnie kliknij Zakończ.
  • Xcode wyświetli komunikat "Czy chcesz skonfigurować nagłówek mostkowy Objective-C?"Kliknij" Utwórz Nagłówek Pomostowy" Powinieneś zobaczyć nowy plik w swoim projekcie o nazwie YourProjectName-Bridging-Header.h.
  • Dodaj tę linię do pliku: # import " iCarousel.h "
  • po dodaniu iCarousel do projektu możesz zacząć go używać.
  • Upewnij się, że przestrzegasz protokołów iCarouselDelegate i iCarouselDataSource.

Swift 3 Przykładowy Kod:

    override func viewDidLoad() {
      super.viewDidLoad()
      let carousel = iCarousel(frame: CGRect(x: 0, y: 0, width: 300, height: 200))
      carousel.dataSource = self
      carousel.type = .coverFlow
      view.addSubview(carousel) 
    }

   func numberOfItems(in carousel: iCarousel) -> Int {
        return 10
    }

    func carousel(_ carousel: iCarousel, viewForItemAt index: Int, reusing view: UIView?) -> UIView {
        let imageView: UIImageView

        if view != nil {
            imageView = view as! UIImageView
        } else {
            imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 128, height: 128))
        }

        imageView.image = UIImage(named: "example")

        return imageView
    }
 0
Author: Tech,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-12-21 11:43:29