Retina and non-retina ios App

У меня проблема с дисплеями Retina. У меня есть приложение, которое отлично работает на дисплеях без сетчатки.Retina and non-retina ios App

В моем css для списка Я установил высоту listitem в 20px.

Теперь, когда я пытаюсь приложение на Retina-дисплей все элементы появляются два раза размер. Я думаю, потому что разрешение iPhone 4 (например, window.innerHeight) по-прежнему 480x320, даже если реальное разрешение должно быть 960x640.

мой вопрос:, мне нужен отдельный css для дисплеев сетчатки или я могу масштабировать все?

источник

2012-05-04 Mike Äfer

веб-приложение или родное приложения? – balexandre

веб-приложение. извините забыл об этом. –

как веб-приложение, вам нужно будет использовать

-webkit-min-device-pixel-ratio:2

, как это медиа-запрос CSS, который позволит вам знать, если он есть, или это не проявление

сетчатка для небольшой пример на изображении, при условии, что у вас есть:

<body class="bkground"> ... </body>

обычно вы будете иметь что-то вроде:

.bkground { 
    background-image: url(my-awesome-bkg.png); 
    -webkit-background-size: 32px 16px; 
}

, чтобы загрузить его в сетчатке дисплеев, вам нужно добавить:

@media all and (-webkit-min-device-pixel-ratio:2) { 
    .bkground { 
    background-image: url(my-awesome-bkg-hd.png); 
    } 
}

или загрузить все изображения во внешнем CSS с помощью:

<link rel="stylesheet" 
     href="retina.css" 
     media="all and (-webkit-min-device-pixel-ratio:2)" />

Есть внешние услуги, которые делают это для вас автоматически, посмотри на удивительных услугах, предоставляемых Сенча стипендиатами для Sencha.io

Ссылка обновлена для Sencha.io направляющей документации

http://docs.sencha.io/0.3.2/index.html#!/guide

источник

2012-05-04 13:32:16 balexandre

ну да, на изображениях я понимаю, что мне нужно получить два разных. Но, как я уже сказал, это не об изображении, ни о чем. У меня есть css для элементов в списке, каждый listitem должен быть 20px. И по какой-то причине мой iphone 4 считает, что мое разрешение 480x320, поэтому каждый элемент в моем списке отображается в два раза больше, чем я хотел бы. Я не понимаю, почему мое приложение считает, что оно имеет разрешение 480x320, даже если iphone 4 может показать его 960x640. Я мог бы, конечно, создать класс css для сетчатки и один для не-сетчатки и дифференцировать, но это не то, что я хотел бы сделать. –

дайте нам пример URL-адреса, чтобы мы могли его увидеть и помочь ... Я все еще не понимаю, что вы говорите. Я всегда создавал списки, и все они прекрасно отображались на любом устройстве, разрешении экрана и в сетчатке и не-сетчатых дисплеях ... поэтому было бы неплохо иметь на что посмотреть. – balexandre

Retina and non-retina ios App

ответ

Смежные вопросы