WPF界面分享,为我的运气修仙游戏写的客户端,仿的鹅厂初稿
### 部份代码来源于网络,我组装开发环境: win10_x64 vs2022
代码下载
再上图
不能说一模一样,只是像素级模仿.
主要代码也就是前台页面部分了
前台的关键点就是一个阴影,别的也没啥就是排版
```
<Window x:Class="YunQi.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:YunQi"
xmlns:control="clr-namespace:YunQi.library.control"
mc:Ignorable="d"
Title="运气修仙" Height="706" Width="298"
MaxHeight="1000" MaxWidth="610"
MinHeight="600" MinWidth="298"
WindowStartupLocation="CenterScreen" AllowsTransparency="True" Topmost="True"
WindowStyle="None"Background="{x:Null}"ResizeMode="CanResizeWithGrip">
<Window.Resources>
<Style x:Key="btn_close" TargetType="Button">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border" BorderThickness="0" BorderBrush="{x:Null}" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Opacity" Value="1" />
<Setter Property="Background" Value="#FF7F00"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="btn_mini" TargetType="Button">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border" BorderThickness="0" BorderBrush="{x:Null}" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Opacity" Value="0.8" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<GeometryGroup x:Key="clipGeometry" FillRule="Nonzero">
<EllipseGeometry RadiusX="30" RadiusY="30" Center="35, 35"></EllipseGeometry>
</GeometryGroup>
</Window.Resources>
<Border Margin="5" CornerRadius="10" Panel.ZIndex="1">
<Border.Effect>
<DropShadowEffect Color="Gray" ShadowDepth="0" BlurRadius="10" Opacity="0.3" Direction="0"/>
</Border.Effect>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="138"/>
<RowDefinition Height="100*"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Border MouseDown="Border_MouseDown"CornerRadius="2 2 0 0" >
<Border.Background>
<LinearGradientBrush EndPoint="1,0" StartPoint="0,0" MappingMode="RelativeToBoundingBox">
<GradientStop Color="#FF4891FF"/>
<GradientStop Color="#FF35AEFE" Offset="0.227"/>
<GradientStop Color="#FF429AFE"/>
<GradientStop Color="#FF24C9FE" Offset="0.614"/>
<GradientStop Color="#FF20D1FF" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="32"/>
<RowDefinition Height="15*"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="5"/>
<ColumnDefinition Width="79"/>
<ColumnDefinition Width="20*"/>
<ColumnDefinition Width="16"/>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="30"/>
</Grid.ColumnDefinitions>
<Image Source="/res/win_ico/yun.png" HorizontalAlignment="Left" Opacity="0.6" Grid.Column="1" />
<Grid Grid.Column="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="32"/>
<ColumnDefinition Width="32"/>
<ColumnDefinition Width="32"/>
<ColumnDefinition Width="32*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="2" />
<Image Grid.Column="2" Source="/res/win_ico/jingli3.png" />
<Image Grid.Column="3" Source="/res/win_ico/electric quantity.png" />
</Grid>
<Button x:Name="btn_more" ToolTip="更多" Content="" Grid.Column="3" Style="{StaticResource btn_mini}" Click="btn_close_Click" BorderBrush="{x:Null}" Foreground="White" FontSize="18" >
<Button.Background>
<ImageBrush ImageSource="/res/win_ico/more.png" Stretch="Uniform"/>
</Button.Background>
</Button>
<Button x:Name="btn_mini" ToolTip="最小化" Content="—" Grid.Column="4" Style="{StaticResource btn_mini}" Click="btn_mini_Click" BorderBrush="{x:Null}" Foreground="White" FontSize="16" />
<Button x:Name="btn_close" ToolTip="关闭" Content="×" Grid.Column="5" Style="{StaticResource btn_close}" Click="btn_close_Click" BorderBrush="{x:Null}" Foreground="White" FontSize="28" />
</Grid>
<Border Grid.Row="1">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="80"/>
<ColumnDefinition Width="60*"/>
<ColumnDefinition Width="70"/>
</Grid.ColumnDefinitions>
<Image Source="/res/win_ico/avator.png" Grid.Column="1"Clip="{StaticResource ResourceKey=clipGeometry}" Height="70" Width="70"/>
<Grid Grid.Column="2">
<Grid.RowDefinitions>
<RowDefinition Height="25*"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<TextBlock Text="小飞侠呀小飞侠" HorizontalAlignment="Left" VerticalAlignment="Bottom" Foreground="White" FontSize="16"/>
<TextBlock Text="金币:1234567" HorizontalAlignment="Left" VerticalAlignment="Bottom" Foreground="White" FontSize="10" Grid.Row="1"/>
<TextBlock Text="灵石:1234567" Foreground="White" FontSize="10" Grid.Row="2"/>
</Grid>
<Viewbox Grid.Column="3">
<Grid>
<!--StrokeDashArray = 路径长度 / StrokeThickness-->
<control:DiscProgress x:Name="conDiscProgress"CurrentValue1="0.9"/>
</Grid>
</Viewbox>
</Grid>
</Border>
<BorderGrid.Row="2" Opacity="0.9">
<Border.Background>
<LinearGradientBrush EndPoint="1,1" StartPoint="0,0">
<GradientStop Color="#FF38ABFF"/>
<GradientStop Color="#FF29C3FF" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<TextBlock TextWrapping="Wrap" Text="公告栏" Foreground="White" HorizontalAlignment="Left" VerticalAlignment="Center"/>
</Border>
</Grid>
</Border>
<Border Grid.Row="1" Background="white"CornerRadius="0 0 2 2">
<TabControlStyle="{StaticResource TabControlElement}">
<TabItem Style="{StaticResource TabItemElement}" Header="公共">
<Grid Background="White"/>
</TabItem>
<TabItem Style="{StaticResource TabItemElement}" Header="门派">
<Grid Background="BlueViolet"/>
</TabItem>
<TabItem Style="{StaticResource TabItemElement}" Header="私聊">
<Grid Background="Coral"/>
</TabItem>
<TabItem Style="{StaticResource TabItemElement}" Header="系统">
<Grid Background="DarkGray"/>
</TabItem>
</TabControl>
</Border>
<Border Grid.Row="2" MouseDown="Border_MouseDown" Cursor="SizeAll" Background="white"CornerRadius="0 0 2 2" BorderBrush="#FFDED8D8" BorderThickness="0,1,0,0">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
<ColumnDefinition Width="35"/>
</Grid.ColumnDefinitions>
<Button Grid.Column="1" BorderBrush="{x:Null}" Style="{StaticResource btn_mini}">
<Button.Background>
<ImageBrush ImageSource="/res/win_ico/warehouse.png" Stretch="Uniform"/>
</Button.Background>
</Button>
<Button Grid.Column="2" BorderBrush="{x:Null}" Style="{StaticResource btn_mini}" >
<Button.Background>
<ImageBrush ImageSource="/res/win_ico/store.png" Stretch="Uniform"/>
</Button.Background>
</Button>
<Button Grid.Column="3" BorderBrush="{x:Null}" Style="{StaticResource btn_mini}" >
<Button.Background>
<ImageBrush ImageSource="/res/win_ico/lilian.png" Stretch="Uniform"/>
</Button.Background>
</Button>
<Button Grid.Column="4" BorderBrush="{x:Null}" Style="{StaticResource btn_mini}" >
<Button.Background>
<ImageBrush ImageSource="/res/win_ico/pojing.png" Stretch="Uniform"/>
</Button.Background>
</Button>
<Button Grid.Column="5" BorderBrush="{x:Null}" Style="{StaticResource btn_mini}" >
<Button.Background>
<ImageBrush ImageSource="/res/win_ico/liandan.png" Stretch="Uniform"/>
</Button.Background>
</Button>
</Grid>
</Border>
</Grid>
</Border>
</Window>
```
后台就是一个顶端吸附,别的也没啥了.
目前找到的这个吸附效果不稳定.,有抖动,需要优化.
```
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.InteropServices;
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.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Windows.Threading;
namespace YunQi
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
private const int BORDER = 3;
private const int AUTOHIDETIME = 50;
private Location _Location = Location.None;
private bool _IsHidded = false;
private DispatcherTimer _AutoHideTimer = null;
public MainWindow()
{
InitializeComponent();
this._AutoHideTimer = new DispatcherTimer();
this._AutoHideTimer.Interval = TimeSpan.FromMilliseconds(AUTOHIDETIME);
this._AutoHideTimer.Tick += new EventHandler(AutoHideTimer_Tick);
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
// 获取窗体句柄
IntPtr hwnd = new System.Windows.Interop.WindowInteropHelper(this).Handle;
// 获得窗体的 样式
int oldstyle = NativeMethods.GetWindowLong(hwnd, NativeMethods.GWL_STYLE);
// 更改窗体的样式为无边框窗体
NativeMethods.SetWindowLong(hwnd, NativeMethods.GWL_STYLE, oldstyle & ~NativeMethods.WS_CAPTION);
// SetWindowLong(hwnd, GWL_EXSTYLE, oldstyle & ~WS_EX_LAYERED);
// 1 | 2 << 8 | 3 << 16r=1,g=2,b=3 详见winuse.h文件
// 设置窗体为透明窗体
NativeMethods.SetLayeredWindowAttributes(hwnd, 1 | 2 << 8 | 3 << 16, 0, NativeMethods.LWA_ALPHA);
// 创建圆角窗体12 这个值可以根据自身项目进行设置
NativeMethods.SetWindowRgn(hwnd, NativeMethods.CreateRoundRectRgn(0, 0, Convert.ToInt32(this.ActualWidth), Convert.ToInt32(this.ActualHeight), 12, 12), true);
}
private void Image_MouseUp(object sender, MouseButtonEventArgs e)
{
System.Windows.Application.Current.Shutdown();
}
private void Image_MouseUpMini(object sender, MouseButtonEventArgs e)
{
this.WindowState = WindowState.Minimized;
}
private void btn_mini_Click(object sender, RoutedEventArgs e)
{
this.WindowState = WindowState.Minimized;
}
private void btn_close_Click(object sender, RoutedEventArgs e)
{
System.Windows.Application.Current.Shutdown();
}
private void Border_MouseDown(object sender, MouseButtonEventArgs e)
{
if (e.ChangedButton == MouseButton.Left)
{
if (Mouse.LeftButton == MouseButtonState.Pressed)
{
var windowMode = this.ResizeMode;
if (this.ResizeMode != ResizeMode.NoResize)
{
this.ResizeMode = ResizeMode.NoResize;
}
this.UpdateLayout();
DragMove();
if (this.ResizeMode != windowMode)
{
this.ResizeMode = windowMode;
}
this.UpdateLayout();
}
}
}
void AutoHideTimer_Tick(object sender, EventArgs e)
{
POINT p;
if (!GetCursorPos(out p))
{
return;
}
if (p.x >= this.Left && p.x <= (this.Left + this.ActualWidth)
&& p.y >= this.Top && p.y <= (this.Top + this.ActualHeight))
{
this.ShowWindow();
}
else
{
this.HideWindow();
}
}
protected override void OnLocationChanged(EventArgs e)
{
if (!this._IsHidded)
{
if (this.Top <= 0 && this.Left <= 0)
{
this._Location = Location.LeftTop;
this.HideWindow();
}
else if (this.Top <= 0 && this.Left >= SystemParameters.VirtualScreenWidth - this.ActualWidth)
{
this._Location = Location.RightTop;
this.HideWindow();
}
else if (this.Top <= 0)
{
this._Location = Location.Top;
this.HideWindow();
}
else
{
this._Location = Location.None;
}
}
base.OnLocationChanged(e);
}
enum Location
{
None,
Top,
LeftTop,
RightTop
}
private void ShowWindow()
{
if (this._IsHidded)
{
switch (this._Location)
{
case Location.Top:
case Location.LeftTop:
case Location.RightTop:
this.Top = 0;
this.Topmost = false;
this._IsHidded = false;
this.UpdateLayout();
break;
case Location.None:
break;
}
}
}
private void HideWindow()
{
if (!this._IsHidded)
{
switch (this._Location)
{
case Location.Top:
this.Top = BORDER - this.ActualHeight;
this.Topmost = true;
this._IsHidded = true;
this._AutoHideTimer.Start();
break;
case Location.LeftTop:
this.Left = 0;
this.Top = BORDER - this.ActualHeight;
this.Topmost = true;
this._IsHidded = true;
this._AutoHideTimer.Start();
break;
case Location.RightTop:
this.Left = SystemParameters.VirtualScreenWidth - this.ActualWidth;
this.Top = BORDER - this.ActualHeight;
this.Topmost = true;
this._IsHidded = true;
this._AutoHideTimer.Start();
break;
case Location.None:
break;
}
}
}
public struct POINT
{
public int x;
public int y;
public POINT(int x, int y)
{
this.x = x;
this.y = y;
}
}
public static extern bool GetCursorPos(out POINT pt);
}
}
```
### END hrpzcf 发表于 2023-1-3 16:04
我知道，但是楼主的后台代码是 C#
C#是微软公司发布的一种由C和C++衍生出来的面向对象的编程语言、运行于.NET Framework和.NET Core(完全开源，跨平台)之上的高级程序设计语言。
百度百科抄的，winForm,WPF本来就是用C#开发的、、、、 星云落花 发表于 2023-1-3 16:45
C#是微软公司发布的一种由C和C++衍生出来的面向对象的编程语言、运行于.NET Framework和.NET Core(完全开 ...
它是指这个帖子的tag选错了，不该选c/c++ 这也仿的太像了吧 哈哈哈 牛哇，但这不是C#么 hrpzcf 发表于 2023-1-2 17:54
牛哇，但这不是C#么
WPF（Windows Presentation Foundation）是微软推出的基于Windows 的用户界面框架，属于.NET 的一部分 星云落花 发表于 2023-1-3 16:00
WPF（Windows Presentation Foundation）是微软推出的基于Windows 的用户界面框架，属于.NET 的一部分
我知道，但是楼主的后台代码是 C# MarioCrane 发表于 2023-1-4 20:38
它是指这个帖子的tag选错了，不该选c/c++
这个还真还没注意、、、 运行了一下，确实很像。主要看下NativeMethods的用法 感谢分享~~~
页:
[1]
2