Udostępnij za pośrednictwem

Wprowadzenie do systemu iOS 7

  • Artykuł

W tym artykule omówiono główne nowe interfejsy API wprowadzone w systemie iOS 7, w tym przejścia kontrolera widoku, ulepszenia animacji UIView, zestaw Dynamics i Text Kit zestawu UIKit. Obejmuje również niektóre zmiany interfejsu użytkownika oraz nowe funkcje wielozadaniowości.

System iOS 7 to główna aktualizacja systemu iOS. Wprowadza zupełnie nowy projekt interfejsu użytkownika, który koncentruje się na zawartości, a nie na chrome aplikacji. Wraz ze zmianami wizualizacji system iOS 7 dodaje mnóstwo nowych interfejsów API w celu tworzenia bogatszych interakcji i środowisk. Ten dokument bada nowe technologie wprowadzone w systemie iOS 7 i służy jako punkt wyjścia do dalszej eksploracji.

Ulepszenia animacji UIView

System iOS 7 rozszerza obsługę animacji w zestawie UIKit, umożliwiając aplikacjom wykonywanie czynności, które wcześniej wymagały porzucania bezpośrednio do platformy Animacja Core. Na przykład UIView można teraz wykonywać animacje sprężynowe, a także animacje klatek kluczowych, które wcześniej CAKeyframeAnimation były stosowane do elementu CALayer.

Animacje spring

UIView teraz obsługuje animowanie zmian właściwości za pomocą efektu wiosny. Aby to dodać, wywołaj metodę AnimateNotify lub AnimateNotifyAsync , przekazując wartości stosunku tłumienia sprężyny i początkową prędkość sprężyny, jak opisano poniżej:

  • springWithDampingRatio – Wartość z zakresu od 0 do 1, gdzie oscylacja zwiększa się dla mniejszej wartości.
  • initialSpringVelocity – Początkowa prędkość wiosny jako procent całkowitej odległości animacji na sekundę.

Poniższy kod generuje efekt wiosny, gdy w środku widoku obrazu zmieni się:

void AnimateWithSpring ()
{
    float springDampingRatio = 0.25f;
    float initialSpringVelocity = 1.0f;

    UIView.AnimateNotify (3.0, 0.0, springDampingRatio, initialSpringVelocity, 0, () => {

        imageView.Center = new CGPoint (imageView.Center.X, 400);

    }, null);
}

Ten efekt wiosny powoduje, że widok obrazu wydaje się odbijać, gdy kończy animację w nowej lokalizacji środkowej, jak pokazano poniżej:

Ten efekt wiosny powoduje, że widok obrazu wydaje się odbijać, gdy kończy animację w nowej lokalizacji środkowej

Animacje klatek kluczowych

Klasa UIView zawiera teraz metodę AnimateWithKeyframes tworzenia animacji klatek kluczowych na obiekcie UIView. Ta metoda jest podobna do innych UIView metod animacji, z tą różnicą, że dodatkowy NSAction parametr jest przekazywany jako parametr do uwzględnienia ramek kluczowych. W obiekcie NSActionramki kluczowe są dodawane przez wywołanie metody UIView.AddKeyframeWithRelativeStartTime.

Na przykład poniższy fragment kodu tworzy animację ramki kluczowej w celu animowania środka widoku oraz obracania widoku:

void AnimateViewWithKeyframes ()
{
    var initialTransform = imageView.Transform;
    var initialCeneter = imageView.Center;

    // can now use keyframes directly on UIView without needing to drop directly into Core Animation

    UIView.AnimateKeyframes (2.0, 0, UIViewKeyframeAnimationOptions.Autoreverse, () => {
        UIView.AddKeyframeWithRelativeStartTime (0.0, 0.5, () => {
            imageView.Center = new CGPoint (200, 200);
        });

        UIView.AddKeyframeWithRelativeStartTime (0.5, 0.5, () => {
            imageView.Transform = CGAffineTransform.MakeRotation ((float)Math.PI / 2);
        });
    }, (finished) => {
        imageView.Center = initialCeneter;
        imageView.Transform = initialTransform;

        AnimateWithSpring ();
    });
}

Dwa pierwsze parametry AddKeyframeWithRelativeStartTime metody określają odpowiednio godzinę rozpoczęcia i czas trwania ramki kluczy jako procent ogólnej długości animacji. Powyższy przykład powoduje animowanie widoku obrazu do nowego środka w ciągu pierwszej sekundy, a następnie obracanie 90 stopni w ciągu następnej sekundy. Ponieważ animacja określa UIViewKeyframeAnimationOptions.Autoreverse jako opcję, obie ramki kluczowe animują się w odwrotnej kolejności. Na koniec końcowe wartości są ustawione na stan początkowy w procedurze obsługi uzupełniania.

Poniższe zrzuty ekranu ilustrują połączoną animację za pomocą klatek kluczowych:

Zrzuty ekranu ilustrują połączoną animację za pośrednictwem klatek kluczowych

UIKit Dynamics

UIKit Dynamics to nowy zestaw interfejsów API w zestawie UIKit, który umożliwia aplikacjom tworzenie animowanych interakcji na podstawie fizyki. UIKit Dynamics hermetyzuje aparat fizyki 2D, aby umożliwić to.

Interfejs API jest deklaratywny w naturze. Deklarujesz, jak działają interakcje fizyki, tworząc obiekty - nazywane zachowaniami - w celu wyrażania pojęć fizyki, takich jak grawitacja, kolizje, źródła itp. Następnie dołączasz zachowania do innego obiektu, nazywanego dynamicznym animatorem, który hermetyzuje widok. Dynamiczny animator dba o zastosowanie zadeklarowanych zachowań fizyki do elementów dynamicznych - elementów implementujących IUIDynamicItem, takich jak UIView.

Istnieje kilka różnych zachowań pierwotnych dostępnych do wyzwalania złożonych interakcji, w tym:

  • UIAttachmentBehavior — dołącza dwa elementy dynamiczne, tak aby były przenoszone razem, lub dołącza element dynamiczny do punktu załącznika.
  • UICollisionBehavior — umożliwia dynamicznym elementom uczestnictwo w kolizjach.
  • UIDynamicItemBehavior — Określa ogólny zestaw właściwości, które mają być stosowane do elementów dynamicznych, takich jak elastyczność, gęstość i tarcie.
  • UIGravityBehavior - Stosuje grawitację do elementu dynamicznego, powodując przyspieszenie elementów w kierunku grawitacyjnym.
  • UIPushBehavior — Stosuje wymuszanie elementu dynamicznego.
  • UISnapBehavior – Umożliwia dynamicznemu elementowi przyciąganie do pozycji z efektem sprężynowym.

Chociaż istnieje wiele elementów pierwotnych, ogólny proces dodawania interakcji opartych na fizyce do widoku przy użyciu interfejsu UIKit Dynamics jest spójny w różnych zachowaniach:

  1. Tworzenie dynamicznego animatora.
  2. Tworzenie zachowań.
  3. Dodaj zachowania do dynamicznego animatora.

Przykład usługi Dynamics

Przyjrzyjmy się przykładowi, który dodaje grawitację i granicę kolizji do elementu UIView.

UIGravityBehavior

Dodanie grawitacji do widoku obrazu jest zgodne z 3 krokami opisanymi powyżej.

W tym przykładzie będziemy pracować w metodzie ViewDidLoad . Najpierw dodaj UIImageView wystąpienie w następujący sposób:

image = UIImage.FromFile ("monkeys.jpg");

imageView = new UIImageView (new CGRect (new CGPoint (View.Center.X - image.Size.Width / 2, 0), image.Size)) {
                    Image =  image
                }

View.AddSubview (imageView);

Spowoduje to utworzenie widoku obrazu wyśrodkowanego na górnej krawędzi ekranu. Aby obraz "spaść" z grawitacją, utwórz wystąpienie elementu UIDynamicAnimator:

dynAnimator = new UIDynamicAnimator (this.View);

Obiekt UIDynamicAnimator przyjmuje wystąpienie odwołania UIView lub UICollectionViewLayout, który zawiera elementy, które będą animowane zgodnie z dołączonymi zachowaniami.

Następnie utwórz UIGravityBehavior wystąpienie. Można przekazać jeden lub więcej obiektów implementowania IUIDynamicItemobiektu , na przykład UIView:

var gravity = new UIGravityBehavior (dynItems);

Zachowanie jest przekazywane tablicy IUIDynamicItem, która w tym przypadku zawiera pojedyncze UIImageView wystąpienie, które animujemy.

Na koniec dodaj zachowanie do dynamicznego animatora:

dynAnimator.AddBehavior (gravity);

Powoduje to animowanie obrazu w dół z grawitacją, jak pokazano poniżej:

Lokalizacja obrazu początkowegoKońcowa lokalizacja obrazu

Ponieważ nie ma żadnych ograniczeń granic ekranu, widok obrazu po prostu spada od dołu. Aby ograniczyć widok tak, aby obraz zderzył się z krawędziami ekranu, możemy dodać UICollisionBehaviorelement . Omówimy to w następnej sekcji.

UICollisionBehavior

Zaczniemy od utworzenia UICollisionBehavior obiektu i dodania go do dynamicznego animatora, tak jak zrobiliśmy dla obiektu UIGravityBehavior.

Zmodyfikuj kod, aby zawierał element UICollisionBehavior:

using (image = UIImage.FromFile ("monkeys.jpg")) {

    imageView = new UIImageView (new CGRect (new CGPoint (View.Center.X - image.Size.Width / 2, 0), image.Size)) {
        Image =  image
    };

    View.AddSubview (imageView);

    // 1. create the dynamic animator
    dynAnimator = new UIDynamicAnimator (this.View);

    // 2. create behavior(s)
    var gravity = new UIGravityBehavior (imageView);
    var collision = new UICollisionBehavior (imageView) {
        TranslatesReferenceBoundsIntoBoundary = true
    };

    // 3. add behaviors(s) to the dynamic animator
    dynAnimator.AddBehaviors (gravity, collision);
}

Obiekt UICollisionBehavior ma właściwość o nazwie TranslatesReferenceBoundsIntoBoundry. Ustawienie tego true ustawienia powoduje, że granice widoku odwołania mają być używane jako granica kolizji.

Teraz, gdy obraz animuje w dół z grawitacją, odbija się nieco od dołu ekranu przed osiedleniem się tam.

UIDynamicItemBehavior

Możemy dodatkowo kontrolować zachowanie widoku obrazu spadającego przy użyciu dodatkowych zachowań. Możemy na przykład dodać element , UIDynamicItemBehavior aby zwiększyć elastyczność, powodując, że widok obrazu będzie odbijał się bardziej, gdy zderzy się z dolną częścią ekranu.

Dodanie elementu jest UIDynamicItemBehavior wykonywane w taki sam sposób, jak w przypadku innych zachowań. Najpierw utwórz zachowanie:

var dynBehavior = new UIDynamicItemBehavior (dynItems) {
    Elasticity = 0.7f
};

Następnie dodaj zachowanie do dynamicznego animatora:

dynAnimator.AddBehavior (dynBehavior);

Dzięki temu zachowaniu widok obrazu odbija się bardziej, gdy zderza się z granicą.

Ogólne zmiany interfejsu użytkownika

Oprócz nowych interfejsów API zestawu UIKit, takich jak UIKit Dynamics, przejścia kontrolera i ulepszone animacje UIView opisane powyżej, system iOS 7 wprowadza różne zmiany wizualne w interfejsie użytkownika i powiązane zmiany interfejsu API dla różnych widoków i kontrolek. Aby uzyskać więcej informacji, zobacz Omówienie interfejsu użytkownika systemu iOS 7.

Zestaw tekstowy

Text Kit to nowy interfejs API, który oferuje zaawansowany układ tekstu i funkcje renderowania. Jest on oparty na strukturze tekstu podstawowego niskiego poziomu, ale jest znacznie łatwiejszy w użyciu niż tekst podstawowy.

Aby uzyskać więcej informacji, zobacz nasz zestaw tekstowy

Wielozadaniowość

System iOS 7 zmienia się, kiedy i jak działa w tle. Ukończenie zadania w systemie iOS 7 nie powoduje już przebudzenia aplikacji, gdy zadania są uruchomione w tle, a aplikacje są wybudowane do przetwarzania w tle w sposób nie ciągły. System iOS 7 dodaje również trzy nowe interfejsy API do aktualizowania aplikacji z nową zawartością w tle:

  • Pobieranie w tle — umożliwia aplikacjom aktualizowanie zawartości w tle w regularnych odstępach czasu.
  • Powiadomienia zdalne — umożliwia aplikacjom aktualizowanie zawartości podczas odbierania powiadomienia wypychanego. Powiadomienia mogą być dyskretne lub mogą wyświetlać baner na ekranie blokady.
  • Usługa transferu w tle — umożliwia przekazywanie i pobieranie danych, takich jak duże pliki, bez ustalonego limitu czasu.

Aby uzyskać więcej szczegółowych informacji na temat nowych funkcji wielozadaniowości, zobacz sekcje systemu iOS w przewodniku dotyczącym obsługi w tle platformy Xamarin.

Podsumowanie

W tym artykule omówiono kilka nowych dodatków do systemu iOS. Najpierw pokazano, jak dodać niestandardowe przejścia do kontrolerów widoku. Następnie pokazuje, jak używać przejść w widokach kolekcji, zarówno z poziomu kontrolera nawigacji, jak i interaktywnie między widokami kolekcji. Następnie wprowadzono kilka ulepszeń animacji UIView, pokazując, jak aplikacje używają zestawu UIKit dla elementów, które wcześniej wymagały programowania bezpośrednio względem animacji core. Na koniec nowy interfejs API usługi Dynamics UIKit, który udostępnia aparat fizyki do zestawu UIKit, jest teraz dostępny wraz z obsługą tekstu sformatowanego dostępnym w strukturze zestawu Text Kit.