<Window x:Class="WpfApp05.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:WpfApp05"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800" WindowStyle="None" Background="Transparent" AllowsTransparency="True"
ResizeMode="NoResize" WindowStartupLocation="CenterScreen" SizeToContent="WidthAndHeight">
<Window.Resources>
<Style TargetType="TextBox" x:Key="UserNameTextBoxStyle">
<Setter Property="Height" Value="35"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TextBox">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
SnapsToDevicePixels="True"
CornerRadius="5">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="40"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Border BorderBrush="#DDD" BorderThickness="0,0,1,0" Margin="0,8,5,8"/>
<TextBlock Text="请输入用户名" Grid.Column="1" VerticalAlignment="Center" Foreground="#BBB"
Name="markText" Visibility="Collapsed" FontSize="12" Margin="2,0"/>
<Image Source="Resources/user.png" Width="20" Height="20"/>
<ScrollViewer x:Name="PART_ContentHost" Focusable="false"
HorizontalScrollBarVisibility="Hidden"
VerticalScrollBarVisibility="Hidden"
Grid.Column="1"
VerticalAlignment="Center" MinHeight="20"/>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" TargetName="border" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="#FF7EB4EA"/>
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="#FF569DE5"/>
</Trigger>
<DataTrigger Binding="{Binding Path=Text,RelativeSource={RelativeSource Mode=Self}}" Value="">
<Setter Property="Visibility" TargetName="markText" Value="Visible"/>
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="PasswordBox" x:Key="PasswordBoxStyle">
<Setter Property="Height" Value="35"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="PasswordBox">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
SnapsToDevicePixels="True"
CornerRadius="5">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="40"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Border BorderBrush="#DDD" BorderThickness="0,0,1,0" Margin="0,8,5,8"/>
<TextBlock Text="请输入密码" Grid.Column="1" VerticalAlignment="Center" Foreground="#BBB"
Name="markText" Visibility="Collapsed" FontSize="12" Margin="2,0"/>
<Image Source="Resources/password.png" Width="20" Height="20"/>
<ScrollViewer x:Name="PART_ContentHost" Focusable="false"
HorizontalScrollBarVisibility="Hidden"
VerticalScrollBarVisibility="Hidden"
Grid.Column="1"
VerticalAlignment="Center" MinHeight="20"/>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" TargetName="border" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="#FF7EB4EA"/>
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="#FF569DE5"/>
</Trigger>
<!--PasswordBox需要绑定到ViewModel才行-->
<DataTrigger Binding="{Binding Path=UserModel.Password}" Value="">
<Setter Property="Visibility" TargetName="markText" Value="Visible"/>
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="Window.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="0" Duration="0:0:0.5"
Storyboard.TargetName="tt"
Storyboard.TargetProperty="X"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Window.Triggers>
<Grid Width="780" Margin="5" Background="Transparent" MouseLeftButtonDown="Grid_MouseLeftButtonDown">
<Border Background="#F7F9FA" Margin="0,6" HorizontalAlignment="Right" Width="360" BorderThickness="0"
CornerRadius="5">
<Border.RenderTransform>
<TranslateTransform X="-330" x:Name="tt"/>
</Border.RenderTransform>
<Grid Margin="60,0,20,20">
<Grid.RowDefinitions>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Button HorizontalAlignment="Right" Width="30" Height="30" VerticalAlignment="Top" Background="Transparent"
BorderBrush="Transparent" Click="btnClose_Click">
<Image Source="Resources/close.png" />
</Button>
<StackPanel Grid.Row="1">
<TextBlock Text="主标题" Foreground="#333" FontSize="22"/>
<TextBlock Text="副标题" FontSize="12" Foreground="#888" Margin="0,10,0,0"/>
</StackPanel>
<!--用户名-->
<TextBox x:Name="txtUserName" Grid.Row="3" Style="{StaticResource UserNameTextBoxStyle}"/>
<PasswordBox x:Name="pwd" Grid.Row="4" Style="{StaticResource PasswordBoxStyle}"/>
<CheckBox Grid.Row="5" Content="记住登录信息" VerticalAlignment="Center" FontSize="10" VerticalContentAlignment="Center"/>
<TextBlock Grid.Row="5" HorizontalAlignment="Right" VerticalAlignment="Center">
<Hyperlink>忘记密码</Hyperlink>
</TextBlock>
<Button Content="登 录" Background="#FF104991" Foreground="White" Grid.Row="6" Height="30" Margin="0,8" BorderThickness="0" VerticalAlignment="Top"
Command="{Binding LoginCommand}"
CommandParameter="{Binding .,RelativeSource={RelativeSource AncestorType=Window}}"/>
<TextBlock Text="Error Message" Foreground="Red" Grid.Row="7" TextWrapping="Wrap" LineHeight="23"
TextAlignment="Center"/>
</Grid>
</Border>
<Polygon Points="0,0 420,0 450,200 420,400 0,400" HorizontalAlignment="Left">
<Polygon.Fill>
<ImageBrush ImageSource="Resources/login_image.jpg" Stretch="UniformToFill" Viewbox="0,0,1.4,1"/>
</Polygon.Fill>
<Polygon.Effect>
<DropShadowEffect Color="Black" ShadowDepth="0" Direction="0" BlurRadius="10" Opacity="0.5"/>
</Polygon.Effect>
</Polygon>
</Grid>
</Window>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace WpfApp05
{
public class UserModel : NotifyBase
{
private string _userName;
public string UserName
{
get { return _userName; }
set
{
_userName = value;
this.NotifyChanged();
}
}
private string _password = "";
public string Password
{
get { return _password; }
set
{
_password = value;
this.NotifyChanged();
}
}
}
}
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading.Tasks;
namespace WpfApp05
{
public class NotifyBase : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public void NotifyChanged([CallerMemberName] string propName = "")
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
}
}
}