У роботі розглядаються
- WPF-додатки
- XAML-розмітка
- Стилі та ресурси
- Програмування інтерфейсу
- Команди WPF
Лабораторна робота № 1.2 з дисципліни «Декларативне програмування графічних інтерфейсів»
Інформація про навчальний заклад
ВУЗ:
Національний технічний університет України Київський політехнічний інститут
Інститут:
ООП
Факультет:
Факультет інформатики та обчислювальної техніки
Кафедра:
Не вказано
Інформація про роботу
Рік:
2022
Тип роботи:
Лабораторна робота
Предмет:
Програмування
Група:
КІ
Коротко про документ
Про що ця робота
У цій лабораторній роботі розглядається створення базового текстового редактора на базі технології WPF. Наведено приклади XAML-розмітки та C#-коду для реалізації основних команд та інтерфейсу.
Зміст і розділи
- Тема та мета роботи
- Завдання 1: Створення ресурсів та стилів
- Завдання 2: Розробка інтерфейсу текстового редактора
- Код для взаємодії з вікном .cs
- Висновок
Для кого:Студенти технічних спеціальностей, які вивчають програмування та розробку користувацьких інтерфейсів.
Викладачі:Викладач кафедри
Ключові поняття
WPFXAMLGridStackPanelCommandBindingOpenFileDialogSaveFileDialogStyleLinearGradientBrushTextBox
Частина тексту файла (без зображень, графіків і формул):
Національний технічний університет України
«Київський політехнічний інститут імені Ігоря Сікорського»
Навчально-науковий інститут атомної та теплової енергетики
Кафедра цифрових технологій в енергетиці
ЛАБОРАТОРНА РОБОТА №1.2
з дисципліни «Декларативне програмування графічних інтерфейсів»
Варіант № 9
Тема: Вступний приклад розробки WPF-додатку.
Мета: Ознайомитись з основами розробки WPF-додатку у вигляді текстового редактора.
Завдання:
Розробити дизайн програми із застосуванням пензлів, ресурсів, стилів, тригерів;
Bиконати Прив'язку команд та елементів.
Виконання роботи:
Завдання 1:
Створити ресурси та стилі для оформлення зовнішнього виду елементів інтерфейсу. Використати їх.
Розмітка XAML:
<Window x:Class="WpfApp1.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:WpfApp1"
mc:Ignorable="d"
Title="TextEditor" Height="450" Width="850">
<!-- Ресурси -->
<Window.Resources>
<LinearGradientBrush x:Key="LinearPanelBrush">
<GradientStop Color="Yellow" Offset="0"></GradientStop>
<GradientStop Color="Turquoise" Offset="0.5"></GradientStop>
<GradientStop Color="Yellow" Offset="1"></GradientStop>
</LinearGradientBrush>
<Style TargetType="Button">
<Style.Setters>
<Setter Property="Control.Margin" Value="5" />
<Setter Property="Control.BorderBrush" Value="White" />
<Setter Property="Control.Background" Value="Transparent" />
</Style.Setters>
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="169*"/>
<ColumnDefinition Width="681*"/>
</Grid.ColumnDefinitions>
<!-- Розмітка Grid-->
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<!-- Офермлення рамок -->
<Border Grid.Row="0" BorderBrush="#FFCBBEBE" BorderThickness="2" CornerRadius="10" Grid.ColumnSpan="2" Background="{DynamicResource LinearPanelBrush}" />
<Border Grid.Row="1" BorderBrush="#FFCBBEBE" BorderThickness="2" CornerRadius="10" Grid.ColumnSpan="2" Background="{DynamicResource LinearPanelBrush}"/>
<!-- Розмітка StackPanel-->
<StackPanel Grid.Row="0" Orientation="Horizontal" Grid.ColumnSpan="2">
<Button>
<Image ToolTip="Відкрити" Source="images\open.png" Width="60"></Image>
</Button>
<Button>
<Image ToolTip="Стерти" Source="images\erase.png" Width="60"></Image>
</Button>
<Button>
<Image ToolTip="Копіювати" Source="images\copy.png" Width="60"></Image>
</Button>
<Button>
<Image ToolTip="Вставити" Source="images\insert.png" Width="60"></Image>
</Button>
</StackPanel>
<!-- Grid для другого рядка -->
<Grid Grid.Row="1" Grid.ColumnSpan="2">
<Grid.RowDefinitions>
<RowDefinition ></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
</Grid.RowDefinitions>
<!-- Розмітка для другого рядка-->
<TextBox Grid.Row="0" Margin="20" TextWrapping="Wrap" VerticalScrollBarVisibility="Visible"></TextBox>
<DockPanel Grid.Row="1" Margin="0,0,0,20">
<Button DockPanel.Dock="Bottom" Width="50" Style="{x:Null}">Oк</Button>
</DockPanel>
</Grid>
</Grid>
</Window>
Результат:
/
Завдання 2:
Розробити у WPF інтерфейс текстового редактора, за наданою інструкцією.
Розмітка XAML:
<Window x:Class="WpfApp1.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:WpfApp1"
mc:Ignorable="d"
Title="TextEditor" Height="450" Width="850">
<!-- Ресурси -->
<Window.Resources>
<LinearGradientBrush x:Key="LinearPanelBrush">
<GradientStop Color="Yellow" Offset="0"></GradientStop>
<GradientStop Color="Turquoise" Offset="0.5"></GradientStop>
<GradientStop Color="Yellow" Offset="1"></GradientStop>
</LinearGradientBrush>
<Style TargetType="Button">
<Style.Setters>
<Setter Property="Control.Margin" Value="5" />
<Setter Property="Control.BorderBrush" Value="White" />
<Setter Property="Control.Background" Value="Transparent" />
</Style.Setters>
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="169*"/>
<ColumnDefinition Width="681*"/>
</Grid.ColumnDefinitions>
<!-- Розмітка Grid-->
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<!-- Офермлення рамок -->
<Border Grid.Row="0" BorderBrush="#FFCBBEBE" BorderThickness="2" CornerRadius="10" Grid.ColumnSpan="2" Background="{DynamicResource LinearPanelBrush}" />
<Border Grid.Row="1" BorderBrush="#FFCBBEBE" BorderThickness="2" CornerRadius="10" Grid.ColumnSpan="2" Background="{DynamicResource LinearPanelBrush}"/>
<!-- Розмітка StackPanel-->
<StackPanel Grid.Row="0" Orientation="Horizontal" Grid.ColumnSpan="2" FocusManager.IsFocusScope="True">
<Button Command="Open">
<Image ToolTip="Відкрити" Source="images\open.png" Width="60"></Image>
</Button>
<Button Command="Delete">
<Image ToolTip="Стерти" Source="images\erase.png" Width="60"/>
</Button>
<Button Command="Copy">
<Image ToolTip="Копіювати" Source="images\copy.png" Width="60"/>
</Button>
<Button Command="Paste">
<Image ToolTip="Вставити" Source="images\insert.png" Width="60"/>
</Button>
</StackPanel>
<!-- Grid для другого рядка -->
<Grid Grid.Row="1" Grid.ColumnSpan="2">
<Grid.RowDefinitions>
<RowDefinition ></RowDefinition>
<RowDefinition Height="auto"></RowDefinition>
</Grid.RowDefinitions>
<!-- Розмітка для другого рядка-->
<TextBox Name="inputTextBox" Grid.Row="0" Margin="20" TextWrapping="Wrap" VerticalScrollBarVisibility="Visible" FontSize="{Binding ElementName=fontSlider, Path=Value, UpdateSourceTrigger=PropertyChanged}"></TextBox>
<DockPanel Grid.Row="1" Margin="20,0,20,20">
<Label>Розмір шрифту:</Label>
<Slider Margin="4" MinWidth="100" Name="fontSlider" Maximum="100" Minimum="12"></Slider>
<Button DockPanel.Dock="Bottom" Width="50" Style="{x:Null}" Command="Save">Oк</Button>
</DockPanel>
</Grid>
</Grid>
</Window>
Код для взаємодії з вікном .cs:
using Microsoft.Win32;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using static System.Net.Mime.MediaTypeNames;
namespace WpfApp1
{
/// <summary>
/// Логика взаимодействия для MainWindow.xaml
/// </summary>
public partial class MainWindow : Window {
public MainWindow()
{
InitializeComponent();
CommandBinding saveCommand = new CommandBinding(ApplicationCommands.Save, execute_Save, canExecute_Save);
CommandBindings.Add(saveCommand);
CommandBinding openCommand = new CommandBinding(ApplicationCommands.Open, execute_Open, canExecute_Open);
CommandBindings.Add(openCommand);
CommandBinding clearCommand = new CommandBinding(ApplicationCommands.Delete, execute_Clear, canExecute_Clear);
CommandBindings.Add(clearCommand);
}
private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
{
}
private void TextBox_TextChanged_1()
{
}
private void canExecute_Save(object sender, CanExecuteRoutedEventArgs e)
{
if (inputTextBox.Text.Trim().Length > 0) e.CanExecute = true; else e.CanExecute = false;
}
private void execute_Save(object sender, ExecutedRoutedEventArgs e)
{
SaveFileDialog save = new SaveFileDialog();
save.InitialDirectory = Assembly.GetEntryAssembly().Location;
save.Filter = "Text files (*.txt)|*.txt";
if (save.ShowDialog() == true)
{
string data = inputTextBox.Text.Trim();
byte[] info = new UTF8Encoding(true).GetBytes(data);
FileStream stream = (FileStream)save.OpenFile();
stream.Write(info, 0, info.Length);
}
}
private void canExecute_Open(object sender, CanExecuteRoutedEventArgs e)
{
e.CanExecute = true;
}
private void execute_Open(object sender, ExecutedRoutedEventArgs e)
{
OpenFileDialog open = new OpenFileDialog();
open.Filter = "Text files (*.txt)|*.txt";
string dir = Assembly.GetEntryAssembly()?.Location;
if (dir != null)
open.InitialDirectory = dir;
if (open.ShowDialog() == true)
inputTextBox.Text = File.ReadAllText(open.FileName);
}
private void canExecute_Clear(object sender, CanExecuteRoutedEventArgs e)
{
if (inputTextBox.Text.Trim().Length > 0) e.CanExecute = true; else e.CanExecute = false;
}
private void execute_Clear(object sender, ExecutedRoutedEventArgs e)
{
inputTextBox.Text = "";
}
}
}
Висновок: Під час виконання роботи було набуто навички з основ розробки WPF-додатків. Виконано завдання лабораторної роботи.
Допоможи студентському архіву
Ми допомогли тобі — допоможи наступному студенту
Оголошення від адміністратора
Подякувати Студентському архіву довільною сумою
Admin
26.02.2023 12:38
Дякуємо, що користуєтесь нашим архівом!