{"id":331,"date":"2015-03-18T22:00:55","date_gmt":"2015-03-18T21:00:55","guid":{"rendered":"http:\/\/ipsview.brownson.at\/?p=331"},"modified":"2015-03-18T22:47:08","modified_gmt":"2015-03-18T21:47:08","slug":"optimale-verwendung-von-images-in-ipsview","status":"publish","type":"post","link":"https:\/\/ipsview.brownson.at\/?p=331","title":{"rendered":"Optimale Verwendung von Images in IPSView"},"content":{"rendered":"

Optimale Gr\u00f6\u00dfe von Images:<\/span><\/p>\n

Damit eine View nicht unn\u00f6tig viel Speicher braucht, sollten Images immer in der optimalen Gr\u00f6\u00dfe in die View eingef\u00fcgt werden.<\/p>\n

Anpassen kann man die Gr\u00f6\u00dfe von Images mit allen g\u00e4ngigen Zeichenprogrammen. Als Beispiel m\u00f6chte ich hier Paint.NET nennen, das auf den meisten Windows Rechner bereits vorinstalliert ist oder frei aus dem Internet heruntergeladen werden kann.<\/p>\n

Zum Verkleinern eines Images \u00f6ffnet man das File in Paint.NET und w\u00e4hlt im Men\u00fc \u201eImage\u201c \u2013 \u201eResize\u201c (alternativ einfach Ctrl+R dr\u00fccken).<\/p>\n

Es erscheint ein Popup, wo man die gew\u00fcnschte Gr\u00f6\u00dfe eingeben kann.<\/p>\n

\"IPSView_ResizeImage_PaintNET\"<\/a><\/p>\n

Nach der Best\u00e4tigung mit OK, wird das Image auf die neue Gr\u00f6\u00dfe berechnet und kann danach im Men\u00fc unter \u201eFile\u201c-\u201eSaveAs\u201c (alternativ durch dr\u00fccken von Ctrl+Shift+S) unter einem neuen Namen abgespeichert werden.<\/p>\n

Wird ein Image in einer View in verschiedenen Gr\u00f6\u00dfen verwendet, reicht es das Image in der h\u00f6chsten Aufl\u00f6sung bereitzustellen (Ausnahme sind hier Images in Buttons, siehe Beschreibung weiter unten).<\/p>\n

Das Image kann im Designer entsprechend verkleinert werden, der Designer erkennt die mehrmalige Verwendung desselben Images und speichert es in der View nur einmalig ab.<\/p>\n

Optimale Gr\u00f6\u00dfe von Images bei HD Ger\u00e4ten:<\/span><\/p>\n

Einige Besonderheiten gibt es auch bei Ger\u00e4ten mit HD Displays. Wenn man zum Beispiel eine View f\u00fcr Android im Modus 1:2 erstellt, dann sollte man die Images doppelt so gro\u00df wie im Designer w\u00e4hlen.<\/p>\n

Hintergrund: Im Designer Modus 1:2 wird die View nach dem Speichern hochgerechnet. Images werden hierbei ebenfalls in H\u00f6he und Breite um 2 multipliziert.<\/p>\n

W\u00e4hlt man nun die Gr\u00f6\u00dfe der Images genauso wie im Designer gezeichnet, kann es am Client dann zu einer unscharfen Darstellung kommen, da das Image hochgerechnet wird.<\/p>\n

W\u00e4hlt man hingegen ein Image in doppelter Aufl\u00f6sung (also zB ein Image mit 64×64 Pixel, das im Designer\u00a0auf eine Gr\u00f6\u00dfe von 32×32 Pixel gesetzt wird), erh\u00e4lt man im Client ein scharfes sauberes Image.<\/p>\n

Anbei ein Beispiel von einem Samsung\u00a0Galaxy TaBPRO, im 2. Screenshot ist nochmals eine direkte Gegen\u00fcberstellung der Images zu sehen:<\/p>\n

\"IPSView_Images_Overview\"<\/a><\/p>\n

\"IPSView_Images_Compare\"<\/a><\/p>\n

Tipp: Der Designer unterst\u00fctzt einem bei der richtigen Auswahl der Gr\u00f6\u00dfe, nach dem Ausw\u00e4hlen eines Images wird automatisch die optimale Gr\u00f6\u00dfe des Steuerelementes gew\u00e4hlt.<\/p>\n

\"IPSView_Images_Designer\"<\/a><\/p>\n

\u00c4hnlich verh\u00e4lt es sich auch bei iOS Ger\u00e4ten mit Retina Displays. Hier gibt es zwar keine M\u00f6glichkeit f\u00fcr einen 1:2 Modus (Apple rechnet intern immer mit Points, wodurch eine gleiche Aufl\u00f6sung auf normalen und Retina Displays erreicht wird), die Problemstellung ist aber die Gleiche.<\/p>\n

D.h. man sollte bei Retina Displays die Images in doppelter Aufl\u00f6sung w\u00e4hlen, um die volle Aufl\u00f6sung des Ger\u00e4te Displays auszun\u00fctzen:<\/p>\n

Images in Buttons:<\/span><\/p>\n

In Buttons versucht IPSView das Image immer in der originalen Gr\u00f6\u00dfe darzustellen. Falls es zu gro\u00df ist, wird es entsprechend verkleinert.<\/p>\n

Um eine optimale Darstellung zu erreichen, sollte man f\u00fcr Buttons immer Images verwenden, die die passende Gr\u00f6\u00dfe f\u00fcr den entsprechenden Button haben.<\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Optimale Gr\u00f6\u00dfe von Images: Damit eine View nicht unn\u00f6tig viel […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1,17],"tags":[19],"class_list":["post-331","post","type-post","status-publish","format-standard","hentry","category-allgemein","category-howto","tag-images"],"_links":{"self":[{"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=\/wp\/v2\/posts\/331","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=331"}],"version-history":[{"count":5,"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=\/wp\/v2\/posts\/331\/revisions"}],"predecessor-version":[{"id":492,"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=\/wp\/v2\/posts\/331\/revisions\/492"}],"wp:attachment":[{"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=331"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=331"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ipsview.brownson.at\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=331"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}