Wykryj iPada Mini w HTML5

IPad Apple Mini to mniejszy klon iPada 2 na więcej sposobów, niż byśmy chcieli. W JavaScript window.navigatorobiekt wyświetla te same wartości dla Mini i iPada 2. Moje dotychczasowe testy w celu wykrycia różnicy nie doprowadziły do ​​sukcesu.

Dlaczego to jest ważne?

Ponieważ ekrany iPada Mini i iPada 2 są identyczne w pikselach, ale różnią się faktycznym rozmiarem (cale / centymetry), różnią się PPI (piksele na cal).

Aby aplikacje internetowe i gry oferowały przyjazny interfejs użytkownika, niektóre elementy są dostosowywane do wielkości kciuka lub palca użytkownika, dlatego możemy przeskalować niektóre obrazy lub przyciski, aby zapewnić lepszą obsługę.

Rzeczy, których do tej pory próbowałem (w tym niektóre dość oczywiste podejścia):

• window.devicepixelratio
• Szerokość elementu CSS w cm
• Zapytania o media CSS (takie jak resolution i -webkit-device-pixel-ratio)
• Rysunki SVG w podobnych jednostkach
• Robienie wszelkiego rodzaju transformacji zestawu CSS przez określony czas i liczenie renderowanych ramek za pomocą requestAnimFrame(miałem nadzieję wykryć mierzalną różnicę)

Brakuje mi pomysłów. Jak o tobie?

Aktualizacja Dziękujemy za dotychczasowe odpowiedzi. Chciałbym skomentować osoby głosujące przeciwko wykryciu iPada mini kontra 2, ponieważ Apple ma Uhm, jedną z wytycznych, aby rządzić nimi wszystkimi. OK, oto moje rozumowanie, dlaczego uważam, że naprawdę sensowne jest, aby wiedzieć, czy dana osoba używa iPada mini lub 2. I rób z moim rozumowaniem to, co lubisz.

IPad mini to nie tylko znacznie mniejsze urządzenie (9,7 cala w porównaniu z 7,9 cala), ale jego forma pozwala na inne użycie. IPad 2 jest zwykle trzymany dwiema rękami podczas grania, chyba że jesteś Chuckiem Norrisem . Mini jest mniejsze, ale jest również znacznie lżejsze i pozwala na rozgrywkę, w której trzymasz go w jednej ręce i używasz drugiej, aby przesunąć, dotknąć lub coś w tym stylu. Jako projektant i programista sam chciałbym się dowiedzieć czy jest to mini, więc mogę wybrać dla gracza inny schemat sterowania, jeśli chcę (na przykład po testach A / B z grupą graczy).

Dlaczego? Cóż, to udowodniony fakt, że większość użytkowników ma tendencję do wybierania ustawień domyślnych, więc pomija się wirtualną pinezkę i wprowadza inną kontrolę opartą na dotknięciu na ekranie (podając tutaj dowolny przykład), gdy gracz ładuje Gra po raz pierwszy jest tym, co ja i prawdopodobnie inni projektanci gier chcielibyśmy mieć zrobić.

IMHO wykracza zatem poza dyskusje na temat grubych palców / wytycznych i jest po prostu czymś, co powinni zrobić Apple i wszyscy inni dostawcy: pozwól nam jednoznacznie zidentyfikować twoje urządzenie i myśleć inaczej, zamiast postępować zgodnie z wytycznymi.

Odtwórz plik audio stereo i porównaj reakcję akcelerometru, gdy głośność jest wysoka na prawym i lewym kanale - iPad2 miał głośniki mono, a iPad Mini ma wbudowane głośniki stereo.

Potrzebujesz pomocy w zbieraniu danych, odwiedź tę stronę i pomóż mi zebrać dane dotyczące tego szalonego pomysłu. Nie mam iPada mini, więc naprawdę potrzebuję twojej pomocy

Aktualizacja: wygląda na to, że te wartości zgłaszają szerokość i wysokość rzutni w momencie tworzenia karty i nie zmieniają się po obrocie, więc nie można użyć tej metody do wykrywania urządzenia !

Można użyć albo screen.availWidthalboscreen.availHeight ponieważ wydają się one różne dla iPada Mini i iPada 2.

iPad Mini

screen.availWidth = 768
screen.availHeight = 1004

iPad 2

screen.availWidth = 748
screen.availHeight = 1024

Źródło: http://konstruktors.com/blog/web-design/4396-detect-ipad-mini-javascript/

Rozumiem, że może to być nieco mało zaawansowane rozwiązanie, ale ponieważ nie wydaje się, abyśmy mogli wymyślić coś jeszcze ...

Zakładam, że sprawdziłeś już większość innych urządzeń, więc widzę możliwe następujące scenariusze.

Możesz sprawdzić WSZYSTKIE możliwe najpopularniejsze urządzenia, które wymagają specjalnego CSS / zmiany rozmiaru, a jeśli pasuje, żadne z nich nie zakłada, że ​​jest to iPad mini, lub po prostu pyta użytkownika?

// Device checks here
...
else {
  // it would probably be better to make this a nicer popup-thing
  var mini = prompt("Are you using a iPad mini? Press yes for a better user experience");
  // Store the result for future visits somehow.
}

Wiem, że może to wydawać się teraz głupim podejściem, ale jeśli obecnie nie mamy możliwości podjęcia decyzji, czy urządzeniem jest iPad mini lub iPad 2, przynajmniej strona internetowa będzie dostępna dla urządzeń iPad mini robiących coś takiego.

Możesz nawet wybrać coś takiego:

„Aby zapewnić najlepszą możliwą jakość przeglądania, staramy się wykryć typ urządzenia, aby dostosować witrynę do urządzenia. Niestety z powodu ograniczeń nie zawsze jest to możliwe i nie możemy obecnie ustalić, czy korzystasz z iPada 2 czy iPada mini przy użyciu tych metod.

Aby uzyskać najlepszą możliwą jakość przeglądania, wybierz poniżej urządzenie, którego używasz.

Ten wybór zostanie zapisany na potrzeby przyszłych wizyt na stronie internetowej na tym urządzeniu.

[] iPad 2 
[*] iPad mini
[] Ancient blackberry device

„

Nie jestem do końca zaznajomiony z tym, co możesz i nie możesz robić po stronie klienta w Javascript. Wiem, że możesz uzyskać adres IP użytkownika, ale czy można uzyskać adres Mac użytkownika? Czy te zakresy różnią się między iPad2 a iPad mini?

Wiem, że to okropne rozwiązanie, ale w tej chwili jedynym sposobem na odróżnienie iPada Mini od iPada 2 jest sprawdzenie numeru kompilacji i mapowanie każdego numeru kompilacji na powiązanym urządzeniu.

Podam przykład: iPad mini, wersja 6.0, wyświetla 10A406numer „ ” jako numer kompilacji, a iPad 2 „ 10A5376e”.

Wartość tę można łatwo uzyskać poprzez wyrażenie regularne na kliencie użytkownika ( window.navigator.userAgent); ten numer jest poprzedzony „ Mobile/”.

Niestety jest to jedyny jednoznaczny sposób na wykrycie iPada Mini; Proponuję zastosować viewportpodejście powiązane (tam, gdzie jest to obsługiwane, używając jednostek vh / vw), aby poprawnie wyświetlać zawartość na różnych rozmiarach ekranu.

tl; dr Nie kompensuj różnicy między iPadem mini a iPadem 2, chyba że zrekompensujesz także tłuste i chude palce.

Wygląda na to, że Apple celowo próbuje nie dać ci do zrozumienia różnicy. Wygląda na to, że Apple nie chce, abyśmy pisali inny kod dla różnych wersji iPadów. Nie będąc częścią Apple, nie wiem tego na pewno, po prostu mówię, że tak to wygląda. Być może, jeśli społeczność programistów wymyśli fantazyjny detektor dla iPada mini, Apple może celowo złamać ten detektor w przyszłych wersjach iOS. Apple chce, abyś ustawił minimalny docelowy rozmiar na 44 punkty iOS, a iOS wyświetli to w dwóch rozmiarach, większym rozmiarze iPada i mniejszym rozmiarze iPhone / iPad mini. 44 punkty to mnóstwo hojności, a twoi użytkownicy z pewnością będą wiedzieć, czy są na mniejszym iPadzie, więc mogą sami to zrekompensować.

Sugeruję cofnięcie się do podanego powodu proszenia detektora: dostosowanie wielkości docelowej dla wygody użytkownika końcowego. Decydując się na zaprojektowanie jednego rozmiaru na dużym iPadzie i innego rozmiaru na małym iPadzie, decydujesz, że wszyscy mają palce tego samego rozmiaru. Jeśli twój projekt jest na tyle ciasny, że różnica w rozmiarze od iPada 2 i iPada mini robi różnicę, to rozmiar palców między mną a moją żoną będzie miał większą różnicę. Więc zrekompensuj rozmiar palca użytkownika, a nie model iPada.

Mam sugestię, jak zmierzyć rozmiar palca. Jestem natywnym programistą iOS, więc nie wiem, czy można tego dokonać w HTML5, ale oto jak zmierzę rozmiar palca w natywnej aplikacji. Chciałbym, aby użytkownik ściśnął dwa obiekty razem, a następnie zmierzył, jak blisko siebie się zbliżają. Mniejsze palce zbliżą obiekty do siebie i możesz użyć tego pomiaru, aby uzyskać współczynnik skalowania. To automatycznie dostosowuje się do rozmiaru iPada. Ta sama osoba będzie miała większy pomiar punktów na ekranie na iPadzie mini niż na iPadzie 2. W przypadku gry możesz to nazwać krokiem kalibracji, a nawet nie wołać. Niech to będzie początek. Na przykład w grze strzeleckiej gracz wkłada amunicję do pistoletu szczypiącym ruchem.

Poproś użytkownika o upuszczenie iPada z kilku tysięcy stóp nad ziemią. Następnie użyj wewnętrznego akcelerometru, aby zmierzyć czas, w którym iPad osiąga prędkość końcową. Większy iPad ma większy współczynnik oporu i powinien osiągnąć prędkość końcową w krótszym czasie niż iPad Mini .

Oto przykładowy kod na początek.

function isIPadMini( var timeToReachTerminalVelocity )
{
    return (timeToReachTerminalVelocity > IPAD_MINI_THRESHOLD);
}

Prawie na pewno trzeba ponownie odwiedzić ten kod, gdy Apple nieuchronnie wypuści następnego iPada w innej formie. Ale jestem pewien, że będziesz na bieżąco i utrzymasz ten hack dla każdej nowej wersji iPada.

Niestety w tej chwili wydaje się, że nie jest to możliwe: http://www.mobilexweb.com/blog/ipad-mini-detection-for-html5-user-agent

Dwa dni temu napisałem tweeta o pierwszym wykrytym problemie: „ Potwierdzono, że agent użytkownika iPada Mini jest taki sam jak iPad 2 ”. Otrzymałem dosłownie setki odpowiedzi z informacją, że wąchanie agenta użytkownika to zła praktyka, że ​​powinniśmy wykrywać funkcje, a nie urządzenia itp.

No cóż, chłopaki, macie rację, ale nie ma to bezpośredniego związku z problemem. I muszę dodać drugą złą wiadomość: nie ma techniki po stronie klienta, aby „wykrywanie funkcji” też nie było .

To szalony strzał, ale jedna z różnic między iPadem 2 a iPadem mini polega na tym, że ten pierwszy nie ma żyroskopu 3-osiowego. Być może będzie można użyć interfejsu API orientacji urządzenia WebKit, aby zobaczyć, jakie informacje można z niego uzyskać.

Na przykład ta strona wydaje się sugerować, że możesz tylko uzyskaćrotationRate wtedy, gdy urządzenie ma żyroskop.

Niestety nie mogę dać działającego POC - nie mam dostępu do iPada mini. Być może ktoś, kto wie trochę więcej na temat tych orientacyjnych interfejsów API, może tu dzwonić.

Cóż, iPad 2 i iPad Mini mają baterie o różnych rozmiarach.

Jeśli iOS 6 Wspiera można uzyskać bieżący poziom baterii z 0.0..1.0użyciem window.navigator.webkitBattery.level. Na pewnym poziomie, zarówno sprzętowym, jak i programowym, jest to prawdopodobnie obliczane jako CurrentLevel / TotalLevel, gdy oba są ints. Jeśli tak, spowoduje to, że liczba zmiennoprzecinkowa będzie wielokrotnością 1 / TotalLevel. Jeśli weźmiesz dużo odczytów poziomu baterii z obu urządzeń i obliczysz battery.level * n, być może uda ci się znaleźć wartość n, w której wszystkie wyniki zaczną być zbliżone do liczb całkowitych, co da ci iPad2TotalLeveli iPadMiniTotalLevel.

Jeśli te dwie liczby są różne i wzajemnie się liczą, wówczas w produkcji można obliczyć battery.level * iPad2TotalLeveli battery.level * iPadMiniTotalLevel. W zależności od liczby całkowitej wskazane zostanie używane urządzenie.

Przepraszamy za liczbę ifs w tej odpowiedzi! Mam nadzieję, że przyjdzie coś lepszego.

EDYCJA 1: Moja pierwotna odpowiedź poniżej brzmiała: „nie rób tego”. Aby być pozytywnym:

Myślę, że prawdziwe pytanie nie ma nic wspólnego z iPadem X kontra iPadem mini. Myślę, że chodzi o optymalizację wymiarów elementu interfejsu użytkownika i umieszczenie go pod kątem ergonomii użytkownika. Musisz określić rozmiar palca / palców użytkownika, aby sterować wielkością elementu interfejsu użytkownika i być może pozycjonowaniem. To znowu jest i prawdopodobnie powinno być osiągnięte bez konieczności faktycznego wiedzieć, na jakim urządzeniu pracujesz. Przesadzajmy: Twoja aplikacja działa na ekranie o przekątnej 40 cali. Nie znam marki i modelu ani DPI. Jak oceniasz formanty?

Musisz wyświetlić przycisk, który jest elementem bramkowania do strony / gry. Od ciebie zależy, czy i gdzie to ma sens.

Podczas gdy użytkownik zobaczy to jako pojedynczy przycisk, w rzeczywistości będzie on składał się z matrycy małych ciasno upakowanych przycisków, które są wizualnie zakryte, aby wyglądały jak obraz jednego przycisku. Wyobraź sobie przycisk 100 x 100 pikseli złożony z 400 przycisków, każdy 5 x 5 pikseli. Musisz eksperymentować, aby zobaczyć, co ma sens tutaj i jak małe powinno być twoje próbkowanie.

Możliwy CSS dla tablicy przycisków:

.sense_row {
  width:100px;
  height:5px;
  margin:0;
  padding:0;
}

.sense_button {
  float:left;
  width:3px;
  height:3px;
  padding:0px;
  margin:0px;
  background-color:#FF0;
  border:1px solid #000;
} 

I wynikowa tablica:

Gdy użytkownik dotknie tablicy przycisków, uzyskasz obraz obszaru kontaktu palca użytkownika. Następnie można użyć dowolnych kryteriów (prawdopodobnie pochodzących z badań empirycznych), aby uzyskać zestaw liczb, których można użyć do skalowania i pozycjonowania różnych elementów interfejsu użytkownika zgodnie z wymaganiami.

Piękno tego podejścia polega na tym, że nie martwisz się już o to, z jaką nazwą urządzenia lub modelem masz do czynienia. Jedyne, na czym Ci zależy, to rozmiar palca użytkownika w stosunku do urządzenia.

Wyobrażam sobie, że ten przycisk sense_array może być ukryty jako część procesu wprowadzania do aplikacji. Na przykład, jeśli jest to gra, może istnieje przycisk „Graj” lub różne przyciski z nazwami użytkowników lub sposób wyboru poziomu, na którym będą grać, itp. Masz pomysł. Przycisk sense_array może znajdować się w dowolnym miejscu, w którym użytkownik musi się dotknąć, aby wejść do gry.

EDYCJA 2: Po prostu zauważam, że prawdopodobnie nie potrzebujesz tylu sensownych przycisków. Zestaw koncentrycznych kół lub przycisków ułożonych jak wielka gwiazdka *może być w porządku. Musisz eksperymentować.

Z moją starą odpowiedzią poniżej podaję obie strony monety.

STARA ODPOWIEDŹ:

Prawidłowa odpowiedź to: nie rób tego. To zły pomysł.

Jeśli twoje guziki są tak małe, że staną się bezużyteczne na mini, musisz je powiększyć.

Jeśli w ogóle nauczyłem się robić natywne aplikacje na iOS, to próbowanie przechytrzenia Apple'a jest formułą na nadmierny ból i pogorszenie. Jeśli zdecydowali się nie pozwalać na identyfikację urządzenia, dzieje się tak, ponieważ w ich piaskownicy nie powinieneś.

Zastanawiam się, czy dostosowujesz rozmiar / lokalizację w pionie czy w poziomie?

Co powiesz na mikroprocesor, oblicz coś, co zajmuje mniej więcej X mikrosekund na iPadzie 2 i Y s na iPadzie mini.

Prawdopodobnie nie jest wystarczająco dokładny, ale może pojawić się instrukcja, w której układ iPada mini jest bardziej wydajny.

Tak, warto sprawdzić żyroskop. Możesz łatwo to zrobić

https://developer.apple.com/documentation/webkitjs/devicemotionevent

lub coś w tym rodzaju

window.ondevicemotion = function(event) {
    if (navigator.platform.indexOf("iPad") != -1 && window.devicePixelRatio == 1) {
        var version = "";
        if (event.acceleration) version = "iPad2";
        else version="iPad Mini";

        alert(version);
    }
    window.ondevicemotion = null;
}​

Nie masz żadnych iPadów, aby to przetestować.

Wymagaj od wszystkich użytkowników agenta użytkownika iPad2 dostarczenia zdjęcia za pomocą wbudowanego aparatu i wykrycia rozdzielczości za pomocą interfejsu API plików HTML . Zdjęcia iPada Mini będą miały wyższą rozdzielczość dzięki ulepszeniom aparatu.

Możesz także pobawić się tworzeniem niewidzialnego elementu canvas i przekonwertować go do formatu PNG / JPG za pomocą Canvas API. Nie mam żadnego sposobu, aby to przetestować, ale wynikowe bity mogą być inne ze względu na podstawowy algorytm kompresji i gęstość pikseli urządzenia.

Zawsze możesz zapytać użytkownika ?!

Jeśli użytkownik nie widzi przycisków lub treści, daj im możliwość samodzielnego zarządzania skalowaniem. Zawsze możesz wbudować w stronę kilka przycisków skalowania, aby zwiększyć / zmniejszyć zawartość (tekst / przyciski). Byłoby (prawie) gwarantowane, że zadziała dla dowolnej bieżącej rozdzielczości iPada i prawdopodobnie każde przyszłe jabłko zdecyduje, że chce to zrobić.

To nie jest odpowiedź na postawione pytanie, ale mam nadzieję, że przyda się bardziej niż powiedzenie „nie rób tego”:

Zamiast wykryć iPada Mini, dlaczego nie wykryć, że użytkownik z trudem uderza w kontrolkę (lub: konsekwentnie uderza w podregion kontrolki) i zwiększać / zmniejszać rozmiar kontrolki, aby je dostosować?

Użytkownicy, którzy potrzebują większej kontroli, otrzymują je niezależnie od sprzętu; użytkownicy, którzy nie potrzebują większej kontroli i chcą zobaczyć więcej treści, też to dostają. Nie jest to proste, jak tylko wykrycie sprzętu, i trzeba będzie zrobić kilka subtelnych rzeczy, ale jeśli zrobi się to ostrożnie, może być naprawdę fajnie.

To przypomina mi cytat z filmu Równowaga:

„Jak powiedziałbyś, co jest najłatwiejszym sposobem na oderwanie broni od duchownego Grammaton?”

„Prosisz go o to”.

Jesteśmy tak przyzwyczajeni do walki o rozwiązania, kiedy czasem lepiej zapytać. (Istnieją dobre powody, dla których zwykle tego nie robimy, ale zawsze jest to opcja). Wszystkie sugestie są genialne, ale prostym rozwiązaniem może być spytanie przez program, którego iPada używają podczas uruchamiania. .

Wiem, że to dość bezczelna odpowiedź, ale mam nadzieję, że to przypomnienie, że nie musimy walczyć o wszystko. (Przygotowałem się na głosy negatywne.: P)

Kilka przykładów:

• Wykrywanie klawiatury podczas instalacji systemu operacyjnego czasami nie może wykryć określonej klawiatury, więc instalator musi o to zapytać.
• Windows pyta, czy sieć, z którą się łączysz, jest siecią domową, czy publiczną.
• Komputery nie mogą wykryć osoby, która będzie z niej korzystać, dlatego wymagają nazwy użytkownika i hasła.

Powodzenia - mam nadzieję, że znajdziesz niesamowite rozwiązanie! Jeśli tego nie zrobisz, nie zapomnij tego.

Nie odpowiada na pytanie, ale pytanie leżące u podstaw pytania:

Twoim celem jest poprawa komfortu użytkowania na mniejszym ekranie. Wygląd kontrolek interfejsu użytkownika jest jego częścią. Inną częścią UX jest sposób, w jaki aplikacja reaguje.

Co zrobić, jeśli obszar, który reaguje na dotknięcia, jest wystarczająco duży, aby był przyjazny dla użytkownika na iPadzie Mini, a wizualna reprezentacja elementów sterujących interfejsu użytkownika była wystarczająco mała, aby był przyjemny wizualnie na iPadzie?

Jeśli zebrałeś wystarczającą liczbę dotknięć, których nie było w obszarze wizualnym, możesz zdecydować o wizualnym skalowaniu kontroli interfejsu użytkownika.

Jako bonus działa to również w przypadku dużych rąk na iPadzie.

Wszystkie rozwiązania tutaj nie są przyszłościowe (co uniemożliwia Apple wypuszczenie iPada o tym samym rozmiarze ekranu co iPad 2, ale o tej samej rozdzielczości co iPad Mini). Więc wpadłem na pomysł:

Utwórz div o szerokości 1 cala i dołącz do ciała. Następnie tworzę kolejny div o 100% szerokości i dołączam go do ciała:

var div1= $("<div/>").appendTo(document.body).width("1in");
var div2= $("<div/>").appendTo(document.body).width("100%");

Funkcja jQuery width () zawsze zwraca wartości w pikselach, dzięki czemu można po prostu:

var screenSize= div2.width() / div1.width();

screenSize ma teraz rozmiar dostępny dla aplikacji w calach (uważaj jednak na zaokrąglanie błędów). Możesz użyć tego, aby umieścić GUI tak, jak lubisz. Nie zapomnij też później usunąć niepotrzebnych div.

Należy również pamiętać, że algorytm zaproponowany przez Kaspars nie tylko nie zadziała, jeśli użytkownik uruchomi aplikację jako pełny ekran, ale również się zepsuje, jeśli Apple załatwi interfejs użytkownika przeglądarki.

Nie różnicuje to urządzeń, ale jak wyjaśniłeś w swojej edycji, tak naprawdę chcesz wiedzieć, jaki jest rozmiar ekranu urządzenia. Mój pomysł nie powie ci również dokładnie rozmiaru ekranu, ale dostarczy Ci jeszcze bardziej przydatnych informacji, rzeczywistego rozmiaru (w calach), jaki masz do narysowania GUI.

EDYCJA: Użyj tego kodu, aby sprawdzić, czy rzeczywiście działa na twoim urządzeniu. Nie posiadam żadnych iPadów do testowania.

var div1= $("<div/>").appendTo(document.body).width("1in").height("1in").css("position", "absolute");
var div2= $("<div/>").appendTo(document.body).width("100%").height("100%").css("position", "absolute");
var width= div2.width() / div1.width()
var height= div2.height() / div1.height()
alert(Math.sqrt(width*width + height*height));

Powinno wyskakować okno z rozmiarem ekranu w calach. Wygląda na to, że działa na moim laptopie, zwracając 15.49, podczas gdy ekran mojego laptopa jest sprzedawany jako 15,4 ''. Czy ktoś może to przetestować na iPadzie i opublikować komentarz? Nie zapomnij uruchomić go na pełnym ekranie.

EDIT2: Okazuje się, że strona, na której testowałem, zawierała trochę sprzecznych CSS . Naprawiłem teraz poprawny kod testowy. Potrzebujesz pozycji: absolut na divach, abyś mógł użyć wysokości w%.

EDIT3: Przeprowadziłem pewne badania i wydaje się, że nie ma sposobu na uzyskanie rozmiaru ekranu na żadnym urządzeniu. To nie jest coś, co system operacyjny może wiedzieć. Gdy używasz jednostki rzeczywistego świata w CSS, jest to po prostu oszacowanie oparte na niektórych właściwościach twojego ekranu. Nie trzeba dodawać, że wcale nie jest to dokładne.

Nie testowano, ale zamiast odtwarzać plik audio i sprawdzać balans, może on słuchać mikrofonu, wyodrębniać szum tła i obliczać jego „kolor” (wykres częstotliwości). Jeśli IPad Mini ma inny model mikrofonu niż IPad 2, to kolor tła powinien być mierzalnie inny, a niektóre techniki odcisków palców audio mogą pomóc ci stwierdzić, które urządzenie jest używane.

Nie sądzę, aby było to możliwe i warte kłopotów w tym konkretnym przypadku, ale myślę, że odcisk palca hałasu w tle może być stosowany w niektórych aplikacjach, na przykład, aby powiedzieć ci, gdzie jesteś, gdy jesteś w budynku.

Na podstawie pytania Douglasa na temat new webkitAudioContext().destination.numberOfChannelsiPada 2 postanowiłem przeprowadzić kilka testów.

Sprawdzanie liczby kanałów zwróconych 2na iPadzie mini, ale nic na iPadzie 2 z iOS 5, a 2także z iOS 6.

Następnie próbowałem sprawdzić, czy webkitAudioContext jest dostępny

var hasWebkitAudio = typeof(webkitAudioContext) === "object";
alert(hasWebkitAudio);​

To samo tutaj iPad Mini i iPad 2 z iOS 6 zwraca wartość true, podczas gdy iPad 2 z iOS 5 zwraca wartość false.

(Ten test nie działa na komputerze, w przypadku komputera sprawdź, czy webkitAudioContext jest funkcją).

Oto kod do wypróbowania: http://jsfiddle.net/sqFbc/

Co się stanie, jeśli utworzysz wiązkę div 1 x 1 i umieścisz je jeden po drugim do div rodzica, dopóki obwiednia nie przeskoczy z 1 cala na 2 cale? Cal na mini ma taki sam rozmiar jak cal na iPadzie, prawda?

W iOS7 istnieje ogólnosystemowe ustawienie, które użytkownik może dostosowywać: gdy rzeczy stają się zbyt małe, aby je odczytać, ustawienie rozmiaru tekstu można zmienić.

Tego rozmiaru tekstu można użyć do utworzenia interfejsu użytkownika o prawdopodobnych wymiarach, np. Dla przycisku (testowany na iPadzie Mini Retina w celu reagowania na zmiany ustawień rozmiaru tekstu):

padding: 0.5em 1em 0.5em 1em;
font: -apple-system-body;    

( przykładowy przycisk CSS, dzięki jsfiddle i cssbuttongenerator)

Wykrywam iPada mini, tworząc płótno, które jest większe do renderowania przez iPada mini , wypełniając piksel, a następnie odczytując kolor z powrotem. IPad mini odczytuje kolor jako „000000”. wszystko inne renderuje to jako kolor wypełnienia.

Kod częściowy:

function rgbToHex(r, g, b) {
    if (r > 255 || g > 255 || b > 255)
        throw "Invalid color component";
    return ((r << 16) | (g << 8) | b).toString(16);
}
var test_colour = '8ed6ff';
working_context.fillStyle = '#' + test_colour;
working_context.fillRect(0,0,1,1);
var colour_data = working_context.getImageData(0, 0, 1, 1).data;
var colour_hex = ("000000" + rgbToHex(colour_data[0], colour_data[1], colour_data[2])).slice(-6);

Potrzebuję tego do zmiany rozmiaru płótna, więc w moim przypadku jest to wykrywanie funkcji.