Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / WPF, Silverlight [игнор отключен] [закрыт для гостей] / Как сделать свой заголовок? / 23 сообщений из 23, страница 1 из 1
02.07.2018, 13:22
    #39668296
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Добрый день.
Хочу сделать свой заголовок, в стиле как в Windows Store - приложениях.

Сделал стиль окна None, приделал сверху свою полоску с кнопками - сверху торчит какая-то белая полоса (1).
Зато в развёрнутом (Maximized) состоянии окно выглядит норм (2).

Добавил AllowTransparency = True - полоска пропала (3), но теперь в развёрнутом состоянии кнопки уползли (см 4 по сравнению с 2). Как сделать нормально, что бы и без полоски, и кнопки не разбегались?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 13:44
    #39668309
Shocker.Pro
Shocker.Pro
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
С ResizeMode не игрался?
Дай тестовую разметку.
На какой винде проявляется?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 13:53
    #39668320
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Shocker.Pro, CanResize пробовал менять. Если поставить CanMinimize или NoResize - всё становится ништяк, но окно теряет мозможность резайзиться. Хотя мои кнопки работают - оно разворачивается, сворачивается и т.д. Но надо ещё и ресайзить.

Разметка:
Код: xml
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
<Window x:Class="HeaderWpf.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:HeaderWpf"
        mc:Ignorable="d"
        Title="MainWindow" Height="150" Width="300" WindowStyle="None" ResizeMode="CanResizeWithGrip"  Background="Blue">
    <Grid HorizontalAlignment="Stretch">
		<Grid.RowDefinitions>
			<RowDefinition Height="Auto" />
			<RowDefinition Height="*" />
		</Grid.RowDefinitions>
		<local:ucHeaderWin10Style x:Name="ucHeader" Grid.Row="0" />
	</Grid>
</Window>



local:ucHeaderWin10Style - это, собственно говоря, мой заголовок (привожу без стилей, для краткости):
Код: xml
1.
2.
3.
4.
5.
6.
7.
8.
	<DockPanel Grid.Row="0" HorizontalAlignment="Stretch" LastChildFill="True">
		<Button DockPanel.Dock="Left" Name="buttonBack" Content="&lt;-" />
		<Button DockPanel.Dock="Right" Name="buttonClose" Content="X" />
		<Button DockPanel.Dock="Right" Name="buttonMax" Content="M" />
		<Button DockPanel.Dock="Right" Name="buttonRst" Content="R" />
		<Button DockPanel.Dock="Right" Name="buttonMin" Content="_" />
		<Label DockPanel.Dock="Left" Name="labelTitle" Content="{Binding Title}" Foreground="White" VerticalAlignment="Center" />
	</DockPanel>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 13:53
    #39668321
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Windows 10
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 14:26
    #39668340
Shocker.Pro
Shocker.Pro
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Воспроизвести на Win7 и Win8 не удалось, десятки под рукой пока нет
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 14:41
    #39668354
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Shocker.Pro, на семёре всё тотно так же воспроизвелось. Разве что вместо полоски сверху - есть полноценный бордюр по краю окна:
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 14:44
    #39668360
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Вот как выглядит обычное окно (1), а вот как - Maximized (2):

видно, что оно уползло на несколько пикселей наружу (как вверх, так и в сторону)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 16:16
    #39668423
Супер_Пав
Супер_Пав
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Код: xml
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.
<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="WpfApplication.MainWindow"
    Height="350" Width="525"
    WindowStartupLocation="CenterScreen"
    WindowStyle="None"
    AllowsTransparency="True"
    Background="Blue">
    <Window.Resources>
        <ResourceDictionary>
            <Style x:Key="NoBordersButton" TargetType="Button">
                <Setter Property="Background" Value="Transparent"/>
                <Setter Property="BorderThickness" Value="1"/>
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="Padding" Value="1"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid x:Name="Chrome" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="#ADADAD"/>
                                    <Setter Property="Opacity" TargetName="Chrome" Value="0.5"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </Window.Resources>
    <Grid>
        <Grid.Style>
            <Style TargetType="Grid">
                <Setter Property="Margin" Value="0"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource AncestorType=Window}}" 
                                 Value="Maximized">
                        <Setter Property="Margin" Value="5"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Style>
        <Grid.RowDefinitions>
            <RowDefinition Height="32"/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="32"/>
                <ColumnDefinition/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Button Grid.Column="0" Style="{StaticResource NoBordersButton}" Cursor="Hand">
                <Button.Content>
                    <Image Source="Images/back.png" Width="24" Height="24"/>
                </Button.Content>
            </Button>
            <TextBlock Grid.Column="1" Text="MainWindow" Foreground="White" 
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"/>
            <StackPanel Grid.Column="2" Orientation="Horizontal">
                <Button Style="{StaticResource NoBordersButton}" Cursor="Hand" Click="OnMinimizeClick">
                    <Button.Content>
                        <Image Source="Images/minimize.png" Width="24" Height="24"/>
                    </Button.Content>
                </Button>
                <Button  Style="{StaticResource NoBordersButton}" Cursor="Hand" Click="OnMaximizeClick">
                    <Button.Content>
                        <Image Source="Images/maximize.png" Width="24" Height="24"/>
                    </Button.Content>
                </Button>
                <Button Style="{StaticResource NoBordersButton}" Cursor="Hand" Click="OnCloseClick">
                    <Button.Content>
                        <Image Source="Images/close.png" Width="24" Height="24"/>
                    </Button.Content>
                </Button>
            </StackPanel>
        </Grid>
    </Grid>
</Window>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 17:18
    #39668459
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Супер_Пав, а как окно-то ресайзить?

ну и плюс - твоя реализация не учитывает наличие 4К мониторов.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 17:27
    #39668466
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Супер_Пав, но вообще, да, кнопки стали на место, только Margin не 5 а 6.

Ещё бы ресайзить было можно. Пока поставил WinGrip, на грип - можно. Но за рамку нельзя.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 17:30
    #39668469
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
=WithGrip
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 17:43
    #39668475
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Супер_Пав, за идею с Binding WindowState - спасибо, сам не додумался.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 17:59
    #39668484
Супер_Пав
Супер_Пав
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Без ResizeMode="CanResizeWithGrip" придется вручную делать: отлавливать положение курсора, нажатие клавиш мышки и тд
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
02.07.2018, 20:17
    #39668505
Roman Mejtes
Roman Mejtes
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Супер_Пав,

о окна есть метод Move() который запускает процесс перемещения формы, без всяких лишних выкрутасов. Сделать область перетаскивания окна, это просто контрол вызывающий этот метод у формы. Всё на уровне представления, без модели. Кнопки должны быть настроенный на команда из ApplicationCommand. Остается только системное меню, его вызов так же не сложно добавить.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
03.07.2018, 11:25
    #39668675
Супер_Пав
Супер_Пав
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Roman MejtesСупер_Пав,

о окна есть метод Move() который запускает процесс перемещения формы, без всяких лишних выкрутасов. Сделать область перетаскивания окна, это просто контрол вызывающий этот метод у формы. Всё на уровне представления, без модели. Кнопки должны быть настроенный на команда из ApplicationCommand. Остается только системное меню, его вызов так же не сложно добавить.
ммм....не понял. Что за метод Move? Нет такого метода. Мы выше обсуждали изменение размеров формы, чтобы можно было растягивать за любую сторону. Возможно, Вы имели ввиду перемещение формы и метод DragMove.
Про кнопки ничего не говорил, если это было замечание на мой пример, то это всего лишь пример.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
03.07.2018, 12:17
    #39668718
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Ну, в общем я тоже вначале сделал невидимый элемент сверху, и показывал его, когда заголовок сползал. Только я сделал через свойства и OnPropertyChanged, связать через {RelativeSource AncestorType=Window} не догадался - ещё не привык к этой архитектуре. Привязать Margin к WindowState, конечно, элегантнее.

Но всё равно это костыль. Получается, сделать свой заголовок с Resizable рамкой без затычек нельзя. Это, конечно, sux.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
03.07.2018, 14:18
    #39668828
Roman Mejtes
Roman Mejtes
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Я не делаю замечаний, просто написал, так как не вижу это в реализации.
Вы правы, не Move, в DragMove()
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
04.07.2018, 08:32
    #39669220
Сон Веры Павловны
Сон Веры Павловны
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Желание сделать попроще привело к заведомо неправильному результату.
Нужно а) полностью перестайлить окно, вынеся заголовок в адорнер окна; б) привязать заголовок к WindowChrome.
Пример в аттаче, т.к. кода достаточно много для одного постинга. Пример является переделанным ModernWindow из FirstFloor.ModernUI , но там целый фреймворк с контроллерами стилей, и в общем не особенно нужными фичами, которые были удалены, а сам пример сокращен до минимума.
Тестировалось на Win7 SP1 x64, и на Win10 - нет никаких проблем ни с резайнгом окна, ни с его перетаскиванием (причем для этого не потребовалось никаких телодвижений типа захвата мыши и проч.), и никакие белые полосы тоже не появляются.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
04.07.2018, 13:23
    #39669462
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Сон Веры Павловны, а можно посмотреть на твой Maximized скриншот? У мня почему-то есть рамка:
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
04.07.2018, 13:24
    #39669463
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
В maximized режиме вокруг заголовка появляется рамка в 1px.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
04.07.2018, 14:03
    #39669490
Roman Mejtes
Roman Mejtes
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
У меня в Maximazed рамки нет Win10, меняйте размер рамки при развёртывании :)

Код: xml
1.
2.
3.
4.
5.
6.
<Trigger Property="WindowState" Value="Maximized">
	<Setter TargetName="Maximize" Property="Visibility" Value="Collapsed" />
	<Setter TargetName="Restore" Property="Visibility" Value="Visible" />
	<Setter TargetName="LayoutRoot" Property="Margin" Value="7" />
        <Setter Property="BorderThickness" Value="0"/>
</Trigger>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
04.07.2018, 14:23
    #39669502
Сон Веры Павловны
Сон Веры Павловны
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
13thВ maximized режиме вокруг заголовка появляется рамка в 1px.
Это так определено в темплейте TitledWindow. Можно задать на все случаи нулевую толщину бордера, или сделать, как выше предложил Роман. В общем, всё есть в исходниках.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
04.07.2018, 16:20
    #39669580
13th
13th
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как сделать свой заголовок?
Супер_Пав, Roman Mejtes, Сон Веры Павловны, спасибо
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / WPF, Silverlight [игнор отключен] [закрыт для гостей] / Как сделать свой заголовок? / 23 сообщений из 23, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]