Несколько вопросов по XAML (C#)

357
07 марта 2017, 13:23

Написал интерфейс в XAML. До этого пользовался только Windows Form.

Возникло несколько вопросов:

  • Как сглаживать изображения? На скриншоте может не особо заметно, но картинки выглядят угловато и это не очень то и красиво.
  • Кнопки тут у меня, в отличии от WinForm, почему-то выглядят не очень симпатично.
  • Как убрать стрелку для элементов не влезающих в тулбар?
  • Как растянуть объект по оставшемуся свободному месту независимо от содержимого. Конкретно TextBox не принимает значение ширины "*" или "Star".

Если вы найдёте в коде ещё какие недочёты, то буду благодарен совету о том, как их исправить. Ибо первый раз работаю и много не знаю.

P.S. Учебник по WPF читаю, но программу надо бы сделать чем раньше, тем лучше, поэтому ждать пока дочитаю и во всём разберусь ждать не приходится.

<Window x:Class="ShikiDesk.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:ShikiDesk"
                mc:Ignorable="d"
                Title="Shikimori | Anime" Height="550" Width="450" Name="mainWindow" Icon="Resources/Images/shiki.png">
    <DockPanel>
        <Menu DockPanel.Dock="Top" Padding="3">
            <MenuItem Header="Меню">
                <MenuItem Header="Настройки">
                    <MenuItem.Icon>
                        <Image Source="Resources/Images/settings.png"></Image>
                    </MenuItem.Icon>
                </MenuItem>
                <Separator />
                <MenuItem Header="Выход">
                    <MenuItem.Icon>
                        <Image Source="Resources/Images/exit-to-app.png"></Image>
                    </MenuItem.Icon>
                </MenuItem>
            </MenuItem>
            <MenuItem Header="Аниме" IsEnabled="False" Name="animeMenuItem" Click="animeMenuItem_Click"></MenuItem>
            <MenuItem Header="Манга" Name="mangaMenuItem" Click="mangaMenuItem_Click"></MenuItem>
            <MenuItem Header="О Программе"></MenuItem>
        </Menu>
        <StackPanel>
            <StackPanel Orientation="Horizontal" MinHeight="200">
                <Image Source="Resources/Images/no-image.png" Width="150" MaxHeight="200" Margin="0,5" StretchDirection="DownOnly" />
                <StackPanel>
                    <Label FontSize="20" FontWeight="Bold" Padding="0, 0, -10, 0">Main title name</Label>
                    <Label FontSize="15" VerticalAlignment="Top" Padding="0,-10,0,0">Second title name</Label>
                    <Separator Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="6" />
                    <Grid Margin="5,0" VerticalAlignment="Top" Name="titleDescriptionGrid">
                        <Grid.RowDefinitions>
                            <RowDefinition></RowDefinition>
                            <RowDefinition Height="0"></RowDefinition>
                            <RowDefinition></RowDefinition>
                            <RowDefinition></RowDefinition>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Label Grid.Row="0" Grid.Column="0" Name="epchLabel">Эпизодов</Label>
                        <StackPanel Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
                            <TextBox VerticalAlignment="Center" Width="40" Name="epchtextBox"></TextBox>
                            <Label Name="epchTotalLabel">/ ?</Label>
                            <Button Margin="3" Padding="5,0">Обновить</Button>
                            <Button Margin="3" Padding="5,0">+</Button>
                            <Button Margin="3" Padding="5,0">-</Button>
                        </StackPanel>
                        <Label Grid.Row="1" Grid.Column="0" Visibility="Collapsed" Name="volLabel">Томов</Label>
                        <StackPanel Orientation="Horizontal" Grid.Row="1" Grid.Column="1">
                            <TextBox VerticalAlignment="Center" Width="40" Visibility="Collapsed" Name="volTextBox"></TextBox>
                            <Label Visibility="Collapsed" Name="volTotalLabel">/ ?</Label>
                        </StackPanel>
                        <Label Grid.Row="2" Grid.Column="0">Статус</Label>
                        <ComboBox Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3" Margin="0,3" HorizontalAlignment="Left" SelectedIndex="0" Width="120" Name="statusComboBox"></ComboBox>
                        <Label Grid.Row="3" Grid.Column="0">Оценка</Label>
                        <ComboBox Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="3" Margin="0,3" HorizontalAlignment="Left" SelectedIndex="0" Width="45" Name="scoreComboBox"></ComboBox>
                    </Grid>
                </StackPanel>
            </StackPanel>
            <Separator />
            <DockPanel Margin="5,3">
                <Button Content="{StaticResource UpdateIcon}" ToolTip="Обновить список" Margin="1,0" />
                <Button Content="{StaticResource InfoIcon}" ToolTip="Подробное инфо о тайтле" Margin="0" />
                <Button Content="{StaticResource AddIcon}" ToolTip="Добавить новый тайтл" Margin="1,0" />
                <Button Content="{StaticResource SearchIcon}" ToolTip="Поиск" DockPanel.Dock="Right" HorizontalAlignment="Right" />
                <TextBox Margin="1,0" VerticalAlignment="Center" Height="25" VerticalContentAlignment="Center" Name="localSearchTextBox" GotFocus="localSearchTextBox_GotFocus" LostFocus="localSearchTextBox_LostFocus">Поиск...</TextBox>
            </DockPanel>
            <Separator />
            <TabControl SelectedIndex="1" Name="tabControl">
                <TabItem Header="Запланировано"></TabItem>
                <TabItem Header="Смотрю"></TabItem>
                <TabItem Header="Просмотрено"></TabItem>
                <TabItem Header="Отложено"></TabItem>
                <TabItem Header="Брошено"></TabItem>
            </TabControl>
        </StackPanel>
    </DockPanel>
</Window>

UPD: Внёс правки в XAML согласно рекомендациям @VladD и ещё одного пользователя, ник которого я не запомнил, а свой ответ он успел удалить.

Answer 1
  1. Сглаживать растровые изображения не нужно. Либо используйте изображение в нативном размере (вот тут много хороших советов), либо переходите наконец на современные технологии и используйте векторные изображения.

  2. Кнопки в WPF стилизуются в зависимости от операционной системы. Попробуйте запустить ту же программу на старой системе, думаю, что будет выглядеть так, как вы хотите.

  3. Убрать overflow grip проще всего, отредактировав шаблон (правая кнопка мыши в визуальном редакторе в Visual Studio 2015+), есть решение с code-behind здесь.

  4. Если вам нужен Toolbar без overflow и с кастомным лэйаутом, используйте вместо него просто DockPanel.

Теперь по коду:

Вы не используете MVVM. У вас данные жёстко прописаны в UI. Это неправильно, нужно отделять контент от представления и брать данные из VM. Например, список статусов и возможные оценки — точно не сфера компетенции UI. Заодно и код получится проще:

<ComboBox ... SelectedItem="{Binding CurrentStatus}" Width="120"
          ItemsSource="{x:Static vm:Status.Values}" DisplayMembername="FriendlyName"/>

и исчезнет дубляж списка оценок.

Grid с семью строками и шестью столбцами кажется неоправданно сложным. Я бы поместил Main title name и Second title name в StackPanel или там DockPanel вместе с остатком, а остаток (Эпизодов/Статус/Оценка) положил в Grid с двумя столбцами и тремя строками.

Ну и поскольку всего на странице много, я бы разбил на маленькие осмысленные UserControl'ы.

READ ALSO
Изменение значения внутри строки

Изменение значения внутри строки

Есть ли способ изменить значение внутри строки не переводя её в массив символов? Например "Машинная сила" в "Машинная пила"

248
C# + Access запись и чтение массива байт

C# + Access запись и чтение массива байт

Имеется программа которая шифрует пароли с помощью AESЭтот алгоритм шифрования использует массивы байт

232
Десериализация JSON в LiteDB

Десериализация JSON в LiteDB

В проекте нужно из JSON-строки получить экземпляр некоторого класса, используя библиотеку LiteDBJSON:

1185