Pokusme se odpovědět na palčivé otázky, které si čtenáři kladou a kladou v komentářích. A my na ně rádi odpovíme.
Začněme s panoramatickými tapetami v iOS 7. Nebo spíše s jejich absencí ...
Panoramatické tapety v iOS 7
Panoramatické tapety se objevily v iOS 7 beta 1. Tato funkce umožňovala nastavení panoramatických fotografií (ukázky panoramat jsou na našem fóru) jako tapety na plochu nebo zamykací obrazovku. Uživatelé kroutili zařízení iOS 7 v rukou a fotografie se na obrazovce pohybovala v závislosti na úhlu, ve kterém se zařízení právě nachází.
V iOS 7 beta 6 z nějakého důvodu Apple tuto funkci z firmwaru odstranil. Proto ve finální verzi iOS 7.0 neexistuje ŽÁDNÁ funkce „Panoramatické tapety“!
Místo tapet si samozřejmě můžete nastavit panoramata. Systém vám to umožní, ale nebude to mít „zas tak“ efekt. Uvidíte pouze efekt Parallax.
Paralaxní efekt v iOS 7
Paralaxní efekt- krásná inovace v iOS 7. Paralaxní efekt umožňuje, aby tapety a ikony na ploše existovaly jakoby odděleně od sebe. Ikony jsou v jedné rovině a tapeta v jiné. Zařízení iOS 7 čte data z gyroskopu a pohybuje těmito rovinami vůči sobě navzájem. V důsledku pohybů vidíme ty části tapety, které zůstaly v zákulisí. Je tu pocit multidimenzionality a hloubky.
Nyní, když jsem vysvětlil, jak funguje efekt paralaxy v systému iOS 7, je zřejmé, že pojmy jako „tapeta paralaxy“ nebo „tapeta s efektem paralaxy“ z hlediska ruského jazyka a chápání procesu jsou chybné a pouze klamat uživatele. Takzvané "tapety Paralaxa" nejsou nic jiného než obyčejné standardní tapety, které se liší pouze rozlišením.
Fotku stačí uložit v požadovaném rozlišení, nahrát do iPadu, iPhonu nebo iPodu Touch a bude mít paralaxový efekt v iOS 7. Pokud to neuděláte nebo použijete tapetu, která byla vytvořena pro iOS 6, pak nepříjemné efekt roztažení obrazu kvůli kterému mnoho našich čtenářů nemohlo dobře spát.
Rozlišení pro snímky, pokud chcete efekt paralaxy v tapetě (v závorkách je standardní doporučené rozlišení pro snímky bez efektu paralaxy v iOS 6 a níže):
iPad 2 – 1424 x 1424(1024 x 1024)
IPAD mini – 1424 x 1424(1024 x 1024)
iPad 3 – 2448 x 2448(2048 x 2048)
iPad 4 – 2448 x 2448(2048 x 2048)
iPhone 4S – 1360 x 1040(960 x 640)
iPhone 5, 5S, 5C –1536 až 1040(1136 x 640)
iPod Touch 5Gen – 1536 až 1040(1136 x 640)
iPhone 4 – nepodporuje efekt paralaxy (960 x 640)
Podnikaví soudruzi již nýtují sbírky speciálních paralaxových tapet silou a hlavní a dokonce vytvářejí takové aplikace. Nyní už ale víme, že vše je jednodušší, než se zdá a tato aplikace je jen pokusem rychle uříznout peníze na vlně ignorace.
Jak si vyrobit tapetu sami?
Je velmi snadné vyrobit si tapetu sami, dokonce i s paralaxovým efektem, i bez něj.
Naše stránky již dlouho obsahují podrobné pokyny s použitím Photoshopu jako příkladu - Jak vytvořit tapetu pro iPad. Instrukce nyní neztratila svůj význam. Hlavní je zvolit správné rozlišení pro vaše zařízení (doporučené rozlišení je v tomto článku o něco vyšší).
Po vytvoření obrázku v požadovaném rozlišení můžete:
1) pošlete si ho poštou a poté si jej uložte do filmu
Jak deaktivovat efekt paralaxy v iOS 7?
Někteří uživatelé nemají rádi efekt paralaxy. Můžete to vypnout v nastavení.
Nastavení-> Obecné-> Univerzální přístup-> Omezit pohyb. Zapněte přepínač "Snížit pohyb".
Dynamické tapety v iOS 7
IOS 7 zavádí dynamické tapety zabudované do systému. Někteří je nazývají „živé“ nebo „dynamické“. Apple ale řekl Dynamic, což znamená, že se budeme držet oficiální terminologie.
Můžete je nainstalovat v nastavení ( Nastavení-> Tapeta a jas-> Výběr tapety-> Dynamický). Podle typu se tapety Dynamic od sebe liší pouze barvou. Nyní je na výběr ze 7 barev.
Na všech tapetách se koule pohybují / snižují / zvyšují / mění průhlednost v reálném čase (každý už ví o lásce společnosti Apple ke koulím).
Vlastní unikát dynamické tapety pro iOS 7 nelze nyní oficiálně vytvořit! Použijte to, co máte. V budoucnu mohou existovat způsoby, jak nastavit vlastní dynamickou tapetu.
Další informativní poznámka se bude týkat paralaxy, která se objevila spolu se sedmou verzí iOS. V tomto článku se pokusíme odpovědět na hlavní otázky, které se týkají uživatele. Jaká je tedy tato panoramatická tapeta a jak nastavit dynamickou tapetu, jak vypnout efekt paralaxy?
Panoramatické snímky v "sedmičce"
Panoramatické obrázky byly přítomny již v první beta verzi iOS 7. Tato funkce umožnila umístit velká panoramata jako tapetu na domovskou obrazovku nebo zamykací obrazovku. Po instalaci mohl uživatel kroutit svým gadgetem iOS 7 v rukou a fotografie se na obrazovce pohybovala v závislosti na úhlu natočení smartphonu nebo tabletu.
V šesté betě tento efekt z nějakého důvodu odstranili z iOS 7. Proto původní čistý iOS 7 nemá takovou funkci jako panoramata. Budete samozřejmě překvapeni a zeptáte se: "Kde jsou?" Byly nahrazeny efektem paralaxy. Samozřejmě můžete umístit panoramata, ale neuvidíte stejný efekt, jaký byl přítomen v iOS 7 beta 1.
Paralaxní efekt
Nyní se podíváme na paralaxu. Jedná se o skvělou inovaci, která umožňuje, aby ikony a tapety na domovské obrazovce žily odděleným životem. Tapeta je v jedné rovině a ikony jsou v jiné. Gadget na iOS 7 čte informace z gyroskopu a pohybuje těmito dvěma rovinami vůči sobě tak, že v důsledku pohybu vidíme ty části obrazu, které byly dříve „v zákulisí“. Díky těmto manipulacím má uživatel pocit hloubky a multidimenzionality.
Když jsme vysvětlili, co je efekt paralaxy a jak funguje v iOS 7, je jasné, že definice jako „Panoramatická tapeta“ nebo „Tapeta Paralaxy“ jsou pro uživatele zavádějící. Z hlediska porozumění procesu a ruského jazyka jsou to skutečně různé funkce, ve skutečnosti jsou to přesně stejné akce. Takzvané „Panoramatické tapety“ nejsou nic jiného než jednoduché fotografie, které se od ostatních obrázků liší pouze svým rozlišením.
K získání takových „Panoramatických tapet“ bude uživatelům stačit uložit jakoukoli fotografii v požadovaném rozlišení a poté ji nahrát do svého tabletu, smartphonu nebo přehrávače s iOS. Pokud to neuděláte nebo vložíte fotografii, která byla použita v šesté verzi operačního systému, může se objevit nepříjemná vada s roztahováním.
Rozlišení fotografií, pokud chcete na pracovní obrazovce získat efekt paralaxy (v závorkách jsme uvedli standardní doporučené rozlišení pro fotografie bez paralaxy od šesté verze iOS):
- Tablet iPad 2 – 1424 x 1424 (1024 x 1024)
- iPad Mini – 1424 x 1424 (1024 x 1024)
- Aypad 3 – 2448 x 2448 (2048 x 2048)
- IPad 4 – 2448 x 2448 (2048 x 2048)
- IPhone 4S – 1360 x 1040 (960 x 640)
- IPhone 5, 5S, 5C -1536 x 1040 (1136 x 640)
- iPod 5. generace – 1536 x 1040 (1136 x 640)
- IPhone 4 - nepodporuje paralaxu (960 x 640)
Již nyní se mnoho lidí zabývá tvorbou různých sbírek s takovými spořiči obrazovky, dokonce existují aplikace „Dynamické a paralaxní spořiče obrazovky“, pomocí kterých si můžete stáhnout nové obrázky. Nyní ale víme, že vše je jednodušší, než se zdá. Takové aplikace jsou jen dalším pokusem ušetřit peníze.
Jak udělat obrázky s tímto efektem sami?
Vše zvládnete pomocí editoru obrázků. Nejoblíbenější možností je samozřejmě Photoshop. Hlavní věc, kterou bude třeba udělat, je vybrat správné rozlišení vhodné pro váš gadget (výše jsme napsali všechna oprávnění pro všechna zařízení). Jakmile budete mít obrázek s požadovaným rozlišením, budete jej muset nahrát do zařízení jedním z těchto způsobů:
- Pošlete si obrázek e-mailem a poté jej uložte do filmu;
- Nahrajte do Dropboxu a znovu uložte do fotogalerie;
- Stahujte podle standardního schématu přes iTunes.
Jak vypnu paralaxu?
Některým uživatelům se tato novinka nelíbí. Můžete to vypnout v nastavení. Nastavení, poté Základní, poté Usnadnění a poté Omezit pohyb. Stlačíme spínač "Snížit pohyb" - tímto stisknutím můžete pralaxu vypnout.
Dynamické obrázky
V aktualizacích iOS 7 se objevily dynamické fotografie. Dynamické snímky lze nastavit v nastavení. Jdeme do Nastavení, tam najdeme záložku „Tapeta a jas“, dále tam najdeme „Výběr tapety“ – Dynamický. Dynamické obrázky se od sebe liší pouze barvou. V tuto chvíli Apple nabízí pouze 7 možností. Dynamické obrázky umožňují pohyb prvků tapety / změnu průhlednosti / snížení v reálném čase.
V den prezentace a 22. října byla vydána aktualizace operačního systému iOS - 7.0.3. Jednou z jeho hlavních novinek je možnost vypnout notoricky známou paralaxu, kvůli které si mnoho uživatelů stěžovalo na nevolnost.
Pro vysvětlení, co je paralaxa v iOS, je nejjednodušší citovat z oficiální prezentace společnosti Apple: „IOS 7 vytváří pocit multidimenzionality. Operační systém maximálně využívá technologie iPhone, iPad a iPod touch k dalšímu rozšíření možností iOS. Jasné a funkční vrstvy vytvářejí hloubku a pořádek ve vašem obsahu. Průsvitné pozadí dává pocit spojení s kontextem a místem. A díky novému přístupu k animaci a pohybu jsou ty nejjednodušší úkoly mnohem zábavnější.“
Jinými slovy, paralaxa vytváří iluzi hloubky 3D obrazovky. Co tedy musíte udělat, abyste paralaxu vypnuli?
- Přejděte do nabídky "Nastavení";
- Dále - "Základní";
- Vyberte "Univerzální přístup";
- Pak - pokles pohybu.
Po těchto akcích uživatel uvidí běžnou plochou obrazovku a žádné 3D efekty nepodkopou jeho zdraví.
Tato funkce se bude hodit nejen těm, kteří se po práci se smartphonem nebo tabletem cítí hůř. Uživatelé tabletů iPhone 4 / 4S a starších mohou vypnout efekt na svém zařízení a zlepšit tak výkon svého zařízení.
Všichni víme, že Apple se snaží postarat o všechny kategorie svých uživatelů a uvolnil na iPhonu takovou funkci, jako je omezení pohybu.
Je velmi užitečný a má logické vysvětlení jeho tvorby a samozřejmě aplikace. Pojďme zjistit, co to je a jak to lze aktivovat.
Co je redukce pohybu v iOS?
Začnu tím, že s příchodem iOS 7 došlo k mnoha změnám a jednou z nich byla vlastnost vizuální hloubky obrazovky.
Pokud na svůj iPhone umístíte speciální standardní tapetu, pak když se zařízení pohne, bude se pohybovat a vše vypadá velmi působivě.
Postupem času se také začaly objevovat vylepšené animace pro otevírání aplikací. Vylepšeny byly také přechodové animace a mnoho dalšího.
Pokud to uživatel prostě nepotřebuje, tak se to dá celé vypnout pomocí funkce „Reduce Motion“. Pomůže to také ušetřit trochu energie baterie.
O jeho zapnutí si povíme trochu později, ale zatím chci vypsat, co přesně se po aktivaci vypne:
- odstraní animaci ve standardní aplikaci Počasí;
- všechny efekty obrazovky jsou zcela změněny;
- paralaxový efekt, co jsem vysvětlil o tapetě, je také vypnutý;
- některé další standardní aplikace také přestávají používat animaci.
Myslím, že jste pochopili hlavní podstatu této funkce a nyní je čas začít část, když vám řeknu, jak správně aktivovat funkci nebo ji v případě potřeby deaktivovat.
Jak zapnout / vypnout redukci pohybu na iPhone?
Tuto část začnu tím, že nejčastěji je tato funkce využívána na starých zařízeních nebo telefonech, jejichž baterie již klesla na hlasitosti. 
To znamená, že slouží k prodloužení životnosti iPhonu a pokud máte starý model a nechcete vidět bezproblémový chod vašeho zařízení na nejnovějším iOS.
Nyní můžete začít zapínat funkci redukce pohybu:
- jako vždy jdeme do Nastavení- hledá předmět Hlavní;
- jít do Univerzální přístup — Snížení pohybu;
- vidíme položku se stejným názvem a stačí ji aktivovat tak, aby se rozsvítila zeleně.
V dolní části jste si mohli všimnout další položky s názvem „Efekty zpráv (Auto)“. Nejlepší je nechat ho aktivní.
Pokud to vypnete, tak v případě, že vám někdo bude posílat zprávy s efektem jako balónky, ohňostroje a další, prostě nebudou fungovat.
Nyní používám iPhony 5S a aktivoval jsem si jej hned po přechodu na iOS 10. Zpočátku je to samozřejmě neobvyklé, ale pak je to normální a práce se stala mnohem pohodlnější.
Myšlenka použití paralaxy v designu mobilních aplikací není nová. Stejně jako mnoho dalších k nám přišla ze světa webdesignu, kde se to zprvu stalo velmi běžným směrem. Paralaxa dodává designu působivý hloubkový efekt a zdánlivý objem. V současné době, kvůli některým nepříjemnostem spojeným se specifiky vývoje webových aplikací, móda paralaxy v designu stránek opadla. Mobilní aplikace jsou však úplně jiný příběh. Paralaxa v mobilním designu žije dál a nikam se neposune a je dokonce ve výchozím nastavení přidána design nového iOS 7 !
V tomto článku vám povíme o naší komponentě DVParallaxView a na příkladu jejího zařízení předvedeme, jak přidat do aplikace přesně stejný paralaxový efekt jako na domovské obrazovce v iOS 7. A ještě lépe.
Jak paralaxa funguje?
Ponořme se na chvíli do drsného světa fyziky, abychom lépe pochopili a strukturovali mechanismus paralaxního efektu. To nám pomůže věrně reprodukovat na obrazovce telefonu.
Jak tedy paralaxa funguje? Jeho podstata je celkem jednoduchá. Paralaxa je změna polohy stejného objektu při pohledu ze dvou různých bodů v prostoru. Tento efekt můžete kdykoli pozorovat v reálném světě. Vše, co potřebujete, je něco velkého, co bude fungovat jako pozadí (například zeď domu) a nějaký objekt pozorovaný na tomto pozadí, které je vám blíže než pozadí (například kandelábr nebo strom). Když budete procházet podél zdi a přitom sledovat kandelábr, budete mít pocit, že se kandelábr vzhledem ke zdi posouvá. Tento efekt se nazývá paralaxa – zdánlivé posunutí sloupu vůči stěně, když posunete pozorovací bod, tedy vy. V tomto případě platí, že čím blíže je sloup k vám, tím vyšší bude rychlost jeho posunutí. Naopak, pokud se od sloupu vzdálíte o značnou vzdálenost a pokusíte se znovu projít po zdi domu, sloupek se vůči stěně prakticky nepohne. Naše oči jsou zvyklé posuzovat vzdálenost objektů mnoha způsoby a jedním z nich je relativní rychlost posunutí objektu. Pokud pozorujete scénu, ve které se předměty pohybují při vašem pohybu různou rychlostí, vaše oči okamžitě mozku řeknou, že předměty jsou od vás v různých vzdálenostech. To je krása použití paralaxy ve vašem návrhu – její simulace dodá ploché scéně hloubku.
V praktickém smyslu pro nás tedy paralaxový efekt spočívá v tom, že objekty umístěné v různých vzdálenostech od vás se vůči vám pohybují různými rychlostmi. Navíc je tato rychlost nepřímo úměrná vaší vzdálenosti od objektů. Pokud jste blízko - rychlost objektu je vysoká, pokud jste daleko - naopak.
Vyzdvihněme hlavní složky tohoto efektu. Za prvé, pro výraznou paralaxu je žádoucí mít pozadí, které je ideálně stacionární, nebo jehož posunutí bude ve srovnání s jinými objekty zanedbatelné. Zadruhé, paralaxu lze pozorovat pouze tehdy, když prostor mezi pozadím a pozorovacím bodem vyplňují předměty. A nejdůležitější věcí u těchto objektů je rozdíl v jejich vzdálenosti od vás. Jinými slovy, objekty by měly tvořit jakousi hierarchii, seřazenou v různých vzdálenostech od pohledu k pozadí. A konečně za třetí, paralaxa je nemožná bez pohybu objektů vzhledem k bodu pozorování různými rychlostmi.
Se všemi třemi hlavními body – pozadím, předměty a relativním pohybem – budeme pozorovat paralaxu.
Paralaxní rolování
Nyní, když víme, jak paralaxa funguje, musíme se rozhodnout, jak přesně ji implementujeme do kódu.
Nejviditelnějším přístupem k implementaci paralaxy je posouvání paralaxy. Hráli jste staré plošinovky? Pokud ano, s největší pravděpodobností si vzpomenete, že zatímco postava běžela z levého konce úrovně na pravý, objekty na pozadí se pohybovaly opačným směrem různou rychlostí v závislosti na očekávané vzdálenosti od popředí. Zde je odkaz na Wikipedii, abyste si přesně zapamatovali, o čem mluvíme.
Paralaxní rolování ve hrách bylo navrženo tak, že scéna, kterou vidíte na obrazovce, se skládá z několika vrstev, na kterých jsou umístěny objekty. V závislosti na odhadované vzdálenosti vrstvy od obrazovky (vrstva „les“ je k vám blíže než vrstva „mraků“, které jsou k vám blíže než vrstva „slunce“), se vrstvy posouvají tou či onou rychlostí. . To dává určitou hloubku tomu, co se děje na obrazovce, takže plochý obraz vypadá objemnější. Je pravda, že tento přístup docela dobře zapadá do toho, co jsme se naučili o paralaxe. Ve skutečnosti můžete mentálně rozdělit prostor mezi vámi a pozadím do vrstev obsahujících objekty v tomto prostoru.
Je logické předpokládat, že implementace paralaxního efektu by měla být zapouzdřena do kontejnerové komponenty, která obsahuje další komponenty a má jakousi hierarchii pohledů, jejichž pozice se bude posouvat o vzdálenost v závislosti na pozici v hierarchii. Zamysleme se, existuje v UIKitu prvek, který už podobnou funkci obsahuje? Samozřejmě že ano! Libovolný UIView obsahuje hierarchii dalších UIViews umístěných v něm metodou addSubview:.
Zde se dostáváme k hlavní myšlence naší komponenty DVParallaxView. Cílem je, aby komponenta byla potomkem UIView a zapouzdřovala paralaxový efekt. Samotný efekt bude implementován předáním nové hodnoty vlastnosti contentOffset typu CGPoint. DvParallaxView má tedy podobný význam jako UIScrollView. Když změníme hodnotu contentOffset, změníme pozici každého pohledu, který je v hierarchii DVParallaxView. Velikost posunutí bude nepřímo úměrná vzdálenosti prvku od „vrcholu“ hierarchie. A protože prvky v poli subviews jsou ukládány od nejnižšího v hierarchii (tj. od nejvzdálenějšího místa od obrazovky), při přímém procházení pole bude offset přímo úměrný indexu zpracovávaného prvku. Tímto způsobem interpretujeme přítomnost „vzdálenosti“ mezi prvky, jako ve skutečném světě. Pro řízení hodnoty vzdálenosti vyvedeme na externí rozhraní vlastnost, která je multiplikátorem, kterým se bude násobit index prvku v poli. Jeho nastavením si můžete hodnotu paralaxy vždy upravit dle libosti.
No, navrhovaný model vypadá životaschopně, všechny hlavní body jsou promyšlené. Zde můžeme ukončit naše seznámení s koncepčním paralaxním zařízením v DVParallaxView a začít příběh o jeho praktické implementaci.
Vytvořte DVParallaxView
V této a dalších kapitolách se blíže podíváme na vytvoření komponenty DVParallaxView.
Než přistoupíme přímo k implementaci, definujme několik vlastností třídy DVParallaxView.
Za prvé, paralaxa vypadá nejlépe a nejčastěji se provádí na pozadí nějakého krásného obrázku (pamatujete, rozhodli jsme se, že jednou z povinných součástí paralaxy je pozadí?). Proto je v naší třídě nutné zajistit možnost nastavení obrázku na pozadí. V samém kořeni hierarchie pohledu bude vždy soukromý prvek třídy UIImageView, který budeme nazývat backgroundImageView. Tento prvek bude fungovat jako pozadí v DVParallaxView. Jeho umístění v kořeni hierarchie nám zaručí nejmenší relativní offset, jak se na pozadí sluší, nejvzdálenější objekt na scéně. Pro přenos obrázku na pozadí bude mít veřejné rozhraní komponenty speciální vlastnost - backgroundImage třídy UIImage.
Za druhé, efekt paralaxy v iOS 7 nepřispívá pouze k posunu pozadí. Při bližším pohledu si všimnete jednoho kuriózního detailu: ikony jsou posunuty v opačném směru, než je posunutí pozadí. To se provádí za účelem zvýšení efektu paralaxy a kontrastu mezi posouvajícím se pozadím a ikonami aplikací, které jsou na první pohled nehybné. Vzhledem k tomu, že jsme se rozhodli dohnat a předběhnout paralaxu v iOS 7, musíme takovou funkci jednoduše přidat do naší komponenty. K tomu si ve veřejném rozhraní vytvoříme vlastnost frontView, do které přeneseme pohled, který chceme posunout opačným směrem než paralaxa.
Takže všechny přípravy byly provedeny - teorie byla studována, zařízení součásti bylo promyšleno. Můžete začít vytvářet DVParallaxView. připraveni?
Vytvořte projekt s jedním pohledem v Xcode, dejte mu název a další požadované atributy. Uvnitř projektu vytvořte třídu DVParallaxView, která je potomkem třídy UIView. Vytvořte hlavičkový soubor DVParallaxView a vyplňte jej následovně.
#import
Všechny vlastnosti třídy, které zde vidíte, jsme již probrali výše, takže by vás jejich sada neměla ničím překvapit. Dvě vlastnosti, které nebyly dříve explicitně diskutovány - parallaxDistanceFactor a parallaxFrontFactor - jsou právě faktory, které slouží k řízení velikosti posunutí prvků hierarchie a čelního pohledu.
V souboru implementace třídy vytvořte soukromé rozhraní. Musíte do něj vložit vlastnost backgroundImageView, protože třída k ní nemusí poskytovat veřejný přístup.
@interface DVParallaxView () @property (neatomický, silný) UIImageView * backgroundImageView; @konec
Nechte objekt třídy vytvořit voláním metody initWithFrame:. V jeho volání musíte provést veškerou počáteční konfiguraci.
- (id) initWithFrame: (CGRect) snímek (self =; if (self) (self.parallaxDistanceFactor = 2.f; self.parallaxFrontFactor = 20.f; self.backgroundColor =;; UIPanGestureRecognizer * panRecognizer = [initWithTarget: vlastní akce : @selector (panHandler :)];;) return self;)
Tyto hodnoty multiplikátorů nastavujeme na základě našich osobních preferencí. Jiné hodnoty můžete zvolit, pokud se vám paralaxa zdá příliš silná nebo naopak příliš slabá. Všimněte si, že pozadí je od samého začátku v hierarchii pohledu, i když pro něj není určen žádný obrázek.
Pokud jste si již položili otázku „Jak zahájíme přesun pohledů v komponentě?“, pak již odpověď na ni vidíte v kódu inicializátoru – UIPanGestureRecognizer. Ano, pamatujeme si, že v iOS 7 se paralaxa spouštěla nakloněním telefonu. Vše má svůj čas.
Selektor metody panHandler: byl předán do UIPanGestureRecognizer. Pojďme si tuto metodu rovnou napsat, abychom ji nezapomněli udělat později.
#pragma mark - Gesture handler - (void) panHandler: (UIPanGestureRecognizer *) pan (CGPoint translation =;;;)
Nic neobvyklého. Načteme pohyb dotyku a nastavíme stejnou hodnotu offsetu pro náš DVParallaxView. Na konci nezapomeňte vynulovat výsledný offset.
Nyní přichází ta zábavná část. Zatím se nic neděje, aby se contentOffset změnil, pojďme to napravit. Vytvořte metodu setter setContentOffset, jak je znázorněno níže.
- (void) setContentOffset: (CGPoint) contentOffset (BOOL backgroundReachedEdgeX = NE; BOOL backgroundReachedEdgeY = NO; double contentDivider; // 1 if (self.backgroundImageView) (contentDivider = self.subviews.count * self.parallaxDistanceFactor = newCGPakeGPenter .backgroundImageView.center.x + (contentOffset.x - _contentOffset.x) / contentDivider, self.backgroundImageView.center.y - (contentOffset.y - _contentOffset.y) / contentDivider); if ((newCenter.x - self .backgroundImageView .frame.size.width / 2.f)> 0.f || (newCenter.x + self.backgroundImageView.frame.size.width / 2.f)< self.bounds.size.width) {
newCenter.x = self.backgroundImageView.center.x;
backgroundReachedEdgeX = YES;
}
if ((newCenter.y - self.backgroundImageView.frame.size.height/2.f) >0.f || (newCenter.y + self.backgroundImageView.frame.size.height / 2.f)< self.bounds.size.height) {
newCenter.y = self.backgroundImageView.center.y;
backgroundReachedEdgeY = YES;
}
self.backgroundImageView.center = newCenter;
}
//
//2
for (int i = 1; i Pojďme se tedy na metodu podívat blíže. Proměnné backgroundReachedEdgeX a backgroundReachedEdgeY se používají k signalizaci, že odsazením pozadí jsme dosáhli okraje obrázku. Pokud je nastaveno pozadí, pak má smysl zkontrolovat, zda jsme nepřekročili rámec backgroundImage. Koneckonců nechceme, aby uživatelé uvažovali o „ořezávání“ obrázku, vypadá to nepřirozeně. Proto jsme považovali za nutné omezit oblast paralaxy na velikost obrázku na pozadí, pokud existuje. Blok // 1 tedy obsahuje kontrolu nad rámec obrázku. Blok // 2 je průchod všemi prvky hierarchie pohledu s výpočtem hodnot posunutí jejich středů v závislosti na jejich pozici v hierarchii. Také, pokud jsme podél osy X nebo Y na okraji obrázku na pozadí, nedojde k žádnému posunutí podél těchto os. Logika hlavního offsetu je vytvořena, moc nezbývá - nastavit metody accessoru pro hlavní vlastnosti a také přetížit metodu addSubview. #pragma mark - Getters - (UIImageView *) backgroundImageView (if (! _backgroundImageView) (_backgroundImageView = [init]; _backgroundImageView.contentMode = UIViewContentModeCenter; _backgroundImageView.center = CGPointMake (CGRectGet SelfMidX) (CGR.bidounds) #; pragma mark - Setters - (void) setParallaxDistanceFactor: (float) parallaxDistanceFactor (_parallaxDistanceFactor = MAX (0.f, parallaxDistanceFactor);) - (void) setParallaxFront) .f, parallaxFrontFactor *Image)));) - (void) backgroundImage (_backgroundImage = backgroundImage;; původ CGPoint = CGPointMake (CGRectGetMidX (self.bounds) - backgroundImage.size.width / 2.f, CGRectGetMidY (self bounds) - backgroundImage.size.height / 2.f); self.backgroundImageView. frame = (CGRect) (. origin = origin, .size = backgroundImage.size);) - (void) setFrontView: (UIView *) frontView ( _frontView = frontView; ; ) #pragma mark - Overriding - (void) addSubview: (UIView *) view (if (self.frontView); else;) Jdeme popořadě. S getterem backgroundImageView je vše jasné - obyčejná líná konkretizace, objekt vytváříme pouze v případě potřeby. Nastavení hodnot ParallaxDistanceFactor a ParallaxFrontFactor automaticky zkontroluje záporné hodnoty. Setter pro backgroundImage nastaví obrázek pozadí v backgroundImageView a současně vycentruje jeho polohu na obrazovce. FrontView setter zároveň přidává frontView do hierarchie subview, takže nemá smysl ho přidávat ručně. Nakonec přetížená metoda addSubview: funguje jako obvykle, pokud frontView není definován v DVParallaxView, ale pokud je definován, pak bude jakýkoli pohled v hierarchii o jednu pozici pod ním. Koneckonců se předpokládá, že frontView je vždy napřed. U toho se zatím zastavíme a přepneme se na hlavní viewController našeho testovacího projektu. Nyní je čas zapojit naši novou součást a otestovat ji v akci. Protože chceme vypadat jako nová domovská obrazovka v iOS 7, pokusíme se ji znovu vytvořit v testovacím projektu. K tomu potřebujeme obrázek na pozadí (nejlépe s obrázkem prostoru) a ikony aplikací. Navíc, protože naše komponenta podporuje i další objekty mezi pozadím a popředím, přidáme je také. Protože pozadím je vesmír, pak rozvineme vesmírné téma a trochu oživíme pouštní prostor planetou Zemí a jejím satelitem - Měsícem. Všechny potřebné obrázky najdete na internetu nebo si je vyzvedněte z našeho testovacího projektu na githubu. V iOS 7 jsou ikony aplikací v popředí, takže v DVParallaxView je musíme umístit do frontView. K tomu si vytvoříme UIView, do kterého umístíme všechny ikony. Abyste nemuseli ručně vytvářet a umisťovat všechny tyto komponenty, vytvořte kontejner a ikony ve scénáři a poté je připojte k ovladači. Takto vypadá čelní pohled v naší testovací aplikaci. Svažte kontejner UIView jako IBOutlet s řadičem a pojmenujte jej frontView. Pojďme k vytvoření instance DVParallaxView. Vytvořte vlastnost parallaxView v privátním rozhraní vašeho ovladače. Vytvořte getter pro tuto vlastnost. - (DVParallaxView *) parallaxView (if (! _ParallaxView) (_parallaxView = [initWithFrame: self.view.bounds]; [_parallaxView setBackgroundImage:]; UIImageView * earth = [initWithImage:]; earth.frame = (CGRect) (.nebo = CGPointMake (CGRectGetMidX (self.view.bounds) - earth.image.size.width / 2.f, CGRectGetMidY (self.view.bounds) - earth.image.size.height / 2.f), .size = earth .frame.size); [_parallaxView addSubview: earth]; UIImageView * měsíc = [initWithImage:]; moon.frame = (CGRect) (.origin = CGPointMake (CGRectGetMidX (self.view.bounds) + 30.f, CGRectGetMidY ( self.view.bounds) + 30.f), .size = moon.frame.size); [_parallaxView addSubview: moon]; [_parallaxView setFrontView: self.frontView];) return _parallaxView;) Kód ukazuje, jak po vytvoření instance třídy DVParallaxView je k ní přiřazeno pozadí „galaxy2“ a poté jsou do hierarchie pohledu přidány obrázky Země a Měsíce. Poté je vlastnost frontView nastavena jako popředí. Nyní už zbývá jen přidat naši komponentu do hierarchie pohledu ovladače. Přidejte tento řádek do metody viewDidLoad: ;
Paralaxa je připravena, můžete začít s projektem. Jak vidíte, komponenta, kterou jsme vytvořili již v této fázi svého vývoje, poskytuje zcela spolehlivý paralaxový efekt. Zbývá už jen jeden detail. Pohyb prvků se zatím provádí dotykem. Je čas to napravit. Je čas připojit gyroskop k DVParallaxView. Pokud jste četli náš článek, pak již máte všechny potřebné dovednosti pro použití gyroskopu v tomto projektu a také víte, že pro připojení gyroskopu musíte do projektu přidat framework Core Motion. Ale jak přesně využijeme data ze senzorů? V našem projektu jsme pro indikaci náklonu telefonu zvolili rotační rychlost. To znamená, že contentOffset se změní, pokud existuje nenulová úhlová rychlost otáčení. Připojte framework k souboru implementace třídy DVParallaxView. #import Poté vytvořte vlastnosti motionManager a displayLink v privátním rozhraní třídy. @property (neatomická, silná) CMMotionManager * motionManager; @vlastnost (neatomická, silná) CADisplayLink * displayLink; CMMotionManager je hlavní třída CoreMotion používaná pro přístup k datům ze senzorů. CADisplayLink je časovač, který pracuje s obnovovací frekvencí obrazovky, která bude volat metodu aktualizace dat z gyroskopu. Nyní přidáme metody přístupového objektu pro nové vlastnosti. - (CADisplayLink *) displayLink (if (! _DisplayLink) (_displayLink =;) return _displayLink;) - (CMMotionManager *) motionManager (if (! _MotionManager) (_motionManager = [init]; _motionManager.deviceMotionUpdate) ;) Je zřejmé, že vývojář používající komponentu DVParallaxView nemusí nutně vždy používat gyroskop. Mohou existovat další podmínky a akce pro změnu hodnoty contentOffset. Komponenta by tedy měla poskytovat možnost volby, zda ovládat paralaxu přes gyroskop. Pro poskytnutí této volby zobrazíme vlastnost gyroscopeControl ve veřejném rozhraní, které bude typu BOOL. Pokud je nastaveno na ANO, součástka začne číst hodnoty gyroskopu a posune hierarchii, když je zařízení nakloněno. Pokud je nastaveno na NE, pak součástka přestane reagovat na změny úhlové rychlosti zařízení. V tomto případě by vlastnosti motionManager a displayLink měly zastavit svou činnost, aby nedocházelo k plýtvání zdroji procesoru. Jak jsme se dohodli, vytvořte vlastnost gyroscopeControl ve veřejném rozhraní. @property (neatomická, silná) BOOL gyroscopeControl; Pak k tomu vytvořte setr. - (void) setGyroscopeControl: (BOOL) gyroscopeControl (if (_gyroscopeControl == gyroscopeControl) return; _gyroscopeControl = gyroscopeControl; if (gyroscopeControl) (; forMode: NSDefaultRunLoopMode];) else (;; self.motion;)) = n Všimněte si, že když je vlastnost nastavena na ANO, motionManager začne přijímat údaje z deviceMotion, nikoli z gyroskopu. Důvody této volby jsou podrobně popsány v článku. Když je nastaveno na NE, příjem dat se zastaví, displayLink se odstraní ze všech vláken voláním metody invalidate a samotný motionManager je nastaven na nulu. Teď už jen musíme napsat metodu pro převod dat z gyroskopu na data pro contentOffset a také implementovat metodu displayLinkHandler, která se volá v časovači displayLink. #pragma mark - Gyroskop to offset - (CGPoint) contentOffsetWithRotationRate: (CMRotationRate) RotationRate (double xOffset = (fabs (rotationRate.y)> DV_ROTATION_THRESHOLD)? RotationRate.y * DV_ROTATION_MULTIPLIER. x)_DVRTHROOLDEROTATION_MULTIPLIER. x)_DVRTHROOLDERATE Rotation. 0.f; CGPoint newOffset = CGPointMake (self.contentOffset.x + xOffset, self.contentOffset.y + yOffset); return newOffset;) - (Handler void) (displayLinkL ) Nezapomeňte hned na začátku implementačního souboru popsat dvě definující konstanty, které jsme použili v transformační metodě. #define DV_ROTATION_THRESHOLD 0.1f #define DV_ROTATION_MULTIPLIER 2.5f Ve třídě controller při vytváření objektu DVParallaxView nastavte jeho vlastnost gyroscopeControl na YES. Gyroskop je tedy připojen, data z něj by nyní měla být správně převedena na offset. Nyní můžete projekt zkompilovat a spustit na zařízení. Vypadá to skvěle, že? Všimněte si, že gyroskop bude fungovat pouze na skutečném zařízení. Pokud čtete tento odstavec, pak jste právě vytvořili samostatnou komponentu s efektem paralaxy, jako v iOS 7. A ještě více - efekt v komponentě DVParallaxView je úplnější, protože posune nejen pozadí a popředí, ale také celá hierarchie prvků mezi nimi. Jak je vidět, jeho zařízení nebylo nijak složité. DVParallaxView jsme vytvořili pro bezplatné použití a nahráli do našeho úložiště. Používejte, vylepšujte, budeme rádi za vaše návrhy!
Připojení Core Motion
Závěr