|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Делаю первую WPF-прилагу. Вернее даже компонент, будет вызываться из основного приложения. Приложение без риббонов, но есть кнопки с битмапами. Если бы были риббоны, там всё классно - ставишь список битмапов с соответствующими тегами, и всё ништяк. А кто как с обычными картинками работает? Сразу скажу, основное приложении, и, соответственно компонент - System Aware (не Per-Monitor). Мне пока первое, что пришло в голову - Сделать по текстовому атрибуту в ViewModel-е на каждую кнопку, и просто забиндить source для Image. А внутри сделать приспособу, что бы в зависимости от DPI возвращало нужное имя битмапа. Ну понятно, что новичок сделает всё неправильно. Расскажите, как надо, кто на картинках собаку съел. ... |
|||
:
Нравится:
Не нравится:
|
|||
13.04.2016, 15:48 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Правильно - вектор )) ... |
|||
:
Нравится:
Не нравится:
|
|||
13.04.2016, 15:58 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Картинки, естественно, растровые. Есть 9 штук каждой - на каждое разрешение. ... |
|||
:
Нравится:
Не нравится:
|
|||
13.04.2016, 15:59 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
картина должна быть на уровне View, предпочтительнее всего закидывать нужные картинки в проект как Resources, создавать ресурсы XAML для них как BitmapSource и источников качестве uri ресурса самой картинки, если их много, то и ресурсов должно быть много. Далее используй либо их через динамические ресурсы по статическому ключу ресурса, либо статические ресурсы по обычному ключу для просты дела. Если 1 элемент интерфейса имеет несколько состояний и для каждого состояния своя картинка, делай триггеры и переключай ресурсы, либо подменяй ресурс по ключу (в варианте с динам. ресурсами) Не стоит забывать, что разрешение в WPF не всегда 96 dpi. Есть еще несколько проблем, проблема А) если элемент спозиционирован не точно по пикселю, то всё его содержимое так же смещается и пиксели картинки оказывают между точками в WPF, что сильно смазывает саму картинку, но: можно выравнивать элемент по точкам свойством SnapToDevicePixels и + можно менять тип рендеринга Б) в ItemsControl элементах (и с панелями), размер элемента списка может не быть круглым числом, по этой причине все последующие элементы будут позиционироваться не в точное значение, а дробное, что тоже будет приводит к сдвигу картинки по ~0,n пикселов и её смазывание, можно округлять размер с помощью свойства В) проблема в том, что когда ты выравниваешь картинку по пикселями в круглые значения, сама картинка оказывается не точно над пикселем, а между ними. Смысл в том, что при разрешении 96 dpi, координаты 0.0 это начало 1 (нулевого) пикселя, а 1.0 его конец и начало 2 пикселя. Г) WPF это не WinForms, WPF изначально заложена векторная графика, по этому наилучшим образом туда подходит именно векторная графика. Геометрические иконкам можно менять цвет, размер, создавать анимацию, нет ни каких проблем в dpi, позиционированием, рендерингом, особенно в Visual контролах, где для этого есть соответствующий метод для Geometry объектов. С векторной иконкой можно точно определить область действия этой иконки, то есть к примеру внутри кнопки можно сделать области, которые не будут являться поверхностью кнопки (дырки в контроле) :) p.s. я давно не юзаю растр. графику в WPF, по этому надеюсь тут будут какие то советы ... |
|||
:
Нравится:
Не нравится:
|
|||
13.04.2016, 21:39 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Roman Mejtes, а в чём сейчас рисуют значки? SVG? ... |
|||
:
Нравится:
Не нравится:
|
|||
14.04.2016, 11:59 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Неважно в чем рисовать, в ресурсы они складываются в виде XAML (Geometry и т.п.) ... |
|||
:
Нравится:
Не нравится:
|
|||
14.04.2016, 12:11 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
13thRoman Mejtes, а в чём сейчас рисуют значки? SVG?я из AI иконки делаю, но можно и из SVG, в AI удобно стандартным Blend'ом это делать ... |
|||
:
Нравится:
Не нравится:
|
|||
14.04.2016, 16:00 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Roman Mejtesя из AI иконки делаю, но можно и из SVG, в AI удобно стандартным Blend'ом это делать А какой формат вектора понимает 2010 студия? Я что-то SVG попробовал - не схавала. Как из AI в студию вставляешь, поподробнее можно? ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 13:55 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Shocker.Pro, не понял, что ты хотел сказать? ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 13:58 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
13thShocker.Pro, не понял, что ты хотел сказать?13thкакой формат вектора понимает 2010 студия?XAML. Векторные рисунки хранят в словарях ресурсов в виде XAML. http://professorweb.ru/my/WPF/graphics_and_animation/level12/graph_animation_index.php ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:08 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Shocker.ProXAML. Векторные рисунки хранят в словарях ресурсов в виде XAML. http://professorweb.ru/my/WPF/graphics_and_animation/level12/graph_animation_index.php Это да. А как из Adobe Illustrator перевести в XAML? И что это за формат, прям файл с расширением XAML получается? Это точно не SVG - я попробовал, не работает: Код: xml 1. 2. 3.
... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:14 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Спросил у дизайнера, он говорит, у него в AI нет никакого XAML ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:15 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Expression Blend умеет конвертировать AI (и некоторые другие форматы) в разные варианты XAML ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:36 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
я пользуюсь вот этим https://www.microsoft.com/en-us/download/details.aspx?id=36180 ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:38 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Shocker.Proя пользуюсь вот этим https://www.microsoft.com/en-us/download/details.aspx?id=36180 собственно, в нем можно и рисовать, хотя штука менее удобная, чем корел, но это дело привычки скорее всего. По крайней мере можно сделать мелкие правки загруженного извне изображения ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:40 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Shocker.Pro, я тут нашёл софтину, которая конвертинует SVG -> XAML. В результате получается или UserControl или Canvas, но по сути - это не изображения. Т.е. мы делаем XAML-файл, в качестве хранилища внешнего ресурса, кладём туда этот UserControl или Canvas и потом цепляем его, например, на кнопку, вместо Image. И больше ничего делать не надо, оно само ресайзится под нужный DPI/размер, под пиксели подстраивается и т.д. Я правильно понял? ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:47 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
13thShocker.Pro, я тут нашёл софтину, которая конвертинует SVG -> XAML. В результате получается или UserControl или Canvas, но по сути - это не изображения. Т.е. мы делаем XAML-файл, в качестве хранилища внешнего ресурса, кладём туда этот UserControl или Canvas и потом цепляем его, например, на кнопку, вместо Image. И больше ничего делать не надо, оно само ресайзится под нужный DPI/размер, под пиксели подстраивается и т.д. Я правильно понял? Если картинка моноцветная, то можно сохранить просто геометрию, которая получена в результате импорта, если иконка многоцветная, то берем полученный Canvas и вставляем куда надо, если картинок несколько, то можно Canvas обернуть в DataTemplate'ы или использовать x:Shared, куча всяких вариантов ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 14:55 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Ещё вопрос: как управлять большими объёмами картинок? Допустим, у меня в приложении 500 картинок. Сложить все в один XAML-файл? А как посмотреть оригинал? Рисовать форму, и вставлять в неё картинку? )-: В общем, хотелось бы что-бы кто-нибудь рассказал о граблях, на которые тут можно наступить. В идеале было бы как в старой студии: есть картинки в каком-то внятном формате, их можно по-мелочи подредактировать прямо в студии, а при сборке проекта они конвертируются в XAML, им проставляются id-шники и делается build. В принципе, для этого можно настроить pre-build step, если бы была тулза, которая конвертирует набор файлов в xaml с заданными id-шниками. ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 15:59 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
13thShocker.Pro, я тут нашёл софтину, которая конвертинует SVG -> XAML. В результате получается или UserControl или Canvas, но по сути - это не изображения.Я дал ссылку на софтину. Она умеет создавать GeometryDrawing или сразу готовые кисти. ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 16:23 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
13thДопустим, у меня в приложении 500 картинок.организовать в несколько словарей ресурсов, можно каскадно. ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 16:24 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
13thА как посмотреть оригинал?Blend позволяет открывать непосредственно солюшен и визуально редактировать в нем XAML-ы. ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 16:26 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Shocker.Pro13thShocker.Pro, я тут нашёл софтину, которая конвертинует SVG -> XAML. В результате получается или UserControl или Canvas, но по сути - это не изображения.Я дал ссылку на софтину. Она умеет создавать GeometryDrawing или сразу готовые кисти. Ага, хорошая ссылка, спс, разобрался. ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 16:35 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
Shocker.Pro13thА как посмотреть оригинал?Blend позволяет открывать непосредственно солюшен и визуально редактировать в нем XAML-ы. Блин, мы пока до бленда не добрались. Могу позволить себе только VS2010. ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 16:38 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
В общем, сделал картинку, вот что получилось: (см аттач). Пока 9 растровых картинок получается красивее. Вот что мне сгенерил Expression Designer: Код: xml 1. 2. 3. 4. 5. 6. 7.
Вот как использую: Код: xml 1.
Можно как-то сделать, что бы было пиксель-в пиксель? Ну хотя бы на кратных 100% (96DPI) разрешениях? ... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 16:44 |
|
DPI Aware картинки - кто какой техникой пользуется?
|
|||
---|---|---|---|
#18+
чтоб было пиксель в пиксель, 1 пиксель должен иметь не 0 координаты, а 0,5 то есть указывать на середину пикселя, а не на его начало. Для этого в DrawContext есть методы PushGuidelineSet. Код: c# 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24.
А вот еще 1 пример для отображения Bitmap рисунков, он не мой и его стоит объединить с верхним варианте, так как там смещение какой то хитро сделано :) Код: c# 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. 34. 35. 36. 37. 38. 39. 40. 41. 42. 43. 44. 45. 46. 47. 48. 49. 50. 51. 52. 53. 54. 55. 56. 57. 58. 59. 60. 61. 62. 63. 64. 65. 66. 67. 68. 69. 70. 71. 72. 73. 74. 75. 76. 77. 78. 79. 80. 81. 82. 83. 84. 85. 86. 87. 88. 89. 90. 91. 92. 93. 94. 95. 96. 97. 98. 99. 100. 101. 102. 103. 104. 105. 106. 107. 108. 109. 110. 111. 112. 113. 114. 115. 116. 117. 118. 119. 120. 121. 122. 123. 124. 125. 126. 127. 128. 129. 130. 131. 132. 133. 134. 135. 136. 137. 138. 139. 140. 141. 142. 143. 144. 145. 146. 147. 148. 149. 150. 151. 152. 153. 154. 155. 156. 157. 158. 159. 160. 161. 162. 163. 164. 165. 166. 167. 168. 169. 170. 171. 172. 173. 174. 175. 176. 177. 178. 179. 180. 181. 182. 183. 184. 185. 186. 187. 188. 189. 190. 191. 192. 193. 194. 195. 196. 197. 198. 199. 200. 201. 202. 203. 204. 205. 206. 207. 208. 209. 210. 211. 212. 213. 214. 215. 216. 217. 218. 219. 220. 221.
... |
|||
:
Нравится:
Не нравится:
|
|||
22.04.2016, 17:02 |
|
|
start [/forum/topic.php?fid=21&fpage=12&tid=1440687]: |
0ms |
get settings: |
11ms |
get forum list: |
14ms |
check forum access: |
4ms |
check topic access: |
4ms |
track hit: |
53ms |
get topic data: |
13ms |
get forum data: |
3ms |
get page messages: |
58ms |
get tp. blocked users: |
2ms |
others: | 231ms |
total: | 393ms |
0 / 0 |