Как создать свой дизайн интерфейса в WPF?

Я искал в гугле информацию о том, как создать свой дизайн окна, элементов управления и.т.д. В итоге немного запутался.Разъясните следующее

1)Можно ли напрямую накидывать макеты из фотошопа на элементы (насколько понял нет)

2)Какие есть UI инструменты чтобы создавать свой дизайн для WPF элементов и окон

3)Что такое метро-приложение WPF (как я понял это уже готовые стили какие-то)
  • Вопрос задан
  • 9233 просмотра
Решения вопроса 1
FoggyFinder
@FoggyFinder
1. "Напрямую накидывать" вероятно, нельзя. Но возможность импорта все-таки присутствует:

How to Import Photoshop Files into WPF

Насколько такой способ рабочий сейчас - не знаю, не проверял.

2. Blend for Visual Studio overview

3. Metro UI особый стиль для приложений / сайтов. Для WPF есть очень известная библиотека MahApps.Metro.

Теперь, что касается "стилизации" - WPF в плане настройки внешнего вида элементов управления и приложений в целом очень гибкий. Можно сделать практически все. Не буду даже пытаться раскрывать тему, материалов в сети очень много, но попробую дать направление для дальнейших поисков:

Ключевые слова:

  • Style
  • DataTemplate
  • Trigger


Для ознакомления материал из документации:

Styling and Templating

А для основательного разбора рекомендую следующую литературу:

  1. WPF: Windows Presentation Foundation в .NET 4.5 с ...

  2. WPF 4. Подробное руководство


Сам я изучал WPF по книге Макдональда, материал изложен в доступной форме, но рассмотрение подробное, а не только основы.

Есть и онлайн ресурсы:

  1. metanit: Руководство по WPF
  2. professorweb: WPF - Windows Presentation Foundation


Некоторые библиотеки, которые упрощают жизнь разработчику, предлагая стилизацию стандартных элементов а также дополняя часто используемыми контролами. Даже если вы не будете использовать ни один из приведенных в списке ниже вариантов, из исходников вы можете извлечь много полезной информации, так что даю ссылки на них, а не на страницы документации:



Первые две очень широко используются.

И напоследок небольшое отступление:

Больше практики, а если в чем-то не уверены - спрашивайте, здесь, на тостере или где-нибудь еще, не так важно.

В начале изучения WPF у вас может быть соблазн смешивать работу с данными (логику приложения) и часть отвечающую за внешний вид (интерфейс). Не стоит так делать, не заводите с самого начала плохих привычек, потом будет сложно переучиваться.

В принципе, можете попробовать совместить F# c WPF, возможности code-behind нам намного-намного меньше ;-), а значит проще будет пойти понять шаблоны MVVM или даже Elmish.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
cyber_roach
@cyber_roach
UX дизайнер INEDIapps
Дополню Foggy Finder
1) напрямую использовать элементы Фотошопа (как и другого редактора) - зло. так или иначе работы по дизайну WPF строятся в 3 этапа
а) дизайн (картинки)
б) верстка дизайна в XAML
в) код контролов, анимации интерактив привязка интерфейса к данным(C#+XAML)

Кроме того Фотошоп это растр, а WPF это вектор.
отсюда ответ на вопрос 2
2) именно для дизайна UI под дальнейшую интеграцию в XAML мы остановились на Inkscape
т.к.
а) его методы рендеринга почти совпадают с direct2D что использует WPF (это очень касается шрифтов, а то в Фотошопе можно такого со шрифтами понаделать, чего в WPF потом будет повторить очень трудоемко)
б) у него есть XML-эдитор который позволяет взять любой векторный объект и вставить его в XAML код как есть (иконки например) т.к. формат Path в WPF это по сути тот же SVG
в) в Inkscape невозможно нарисовать то, чего нельзя сделать в WPF т.е. получается на выходе после верстки почти 1:1
3) Metro - просто стиль дизайна, нет каких-то особых приложений WPF. НО есть UWP, это уже немного другое, хотя схожа платформа с WPF, точнее будет сказать это ее эволюция.

По итогу:
Дизайн WPF приложения нельзя создать без дизайнера (капитанство но факт)
Даже если использовать готовый UI-kit (что в реальных проектах почти не применимо), то вам нужен верстальщик (аналогия c HTML+CSS версткой) который реализует верстку элементов и форм.
Если хотите разобраться с версткой сами - сначала надо освоить сам WPF и , что еще важнее C#
Выше посоветовали книгу М. Макдональда - Я так же начинал с неё.
Но вот XAML и стилизацию, придется освоить самостоятельно уже после, т.к. это чуть уровнем выше (мало знать XAML, надо разбираться во всех тонкостях, чтобы не накосячить) и литературы по этому вопросу нет.
Что важно! Без дизайнерской жилки и тяги к интерфейсам, а так же понимания анимаций, графического дерева элементов, гайдлайнов и еще массы всего сопутствующего - ничего не получится, говорю как не раз пытавшийся обучить этому ремеслу обычных программистов. По факту это отдельная профессия (как и html верстальщик аналогии прямые).
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы