前言
先来看看TIM的聊天记录是怎么样子的
TIM.gif
这里面有几个功能：
- 点击消息记录按钮，会向右扩展一段距离，显示聊天记录。
- 缩放的时候，聊天记录部分保持不变，左边的区域缩放。
- 再次点击消息记录按钮，之前扩展的部分缩回。
初步思路
一开始我的想法是：
- 使用Grid分列，左边部分的大小是*，右边部分的大小是auto。
- 点击按钮时显示和隐藏右边部分。
- 窗体随内容变化则使用SizeToContent去实现。
大概是这样：
xaml部分
<Window x:Class="WpfAsync.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:WpfAsync" SizeToContent="WidthAndHeight"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid Background="Red" MinHeight="450" MinWidth="800">
<Button HorizontalAlignment="Left" VerticalAlignment="Top" Click="ButtonBase_OnClick">test</Button>
<Button HorizontalAlignment="Right" VerticalAlignment="Bottom">test1</Button>
</Grid>
<Grid Background="AliceBlue" Grid.Column="1" Width="200" Name="target"></Grid>
</Grid>
</Window>
test1那个按钮是我用来表示左边的边界的，没有实际意义。
C#部分
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
target.Visibility = target.Visibility == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible; rate = Width / Height;
}
}
来看看效果
第一次尝试
一开始还是好好的，按着预想的，点击之后扩展一部分，再次点击缩回。但是一旦进行了窗体的缩放，就没用了。
那么问题出在哪呢？
答案是SizeToContent上面。你不能够设置了SizeToContent，然后去手动改变窗体的大小！所以一般有个SizeToContent都会跟上ResizeMode="NoResize"
如果你设置窗体，让它自适应内容，窗体会以承载的内容的大小来作为自身的大小。而一旦你手动更改了窗体大小，窗体就不知道，到底是以承载的内容为自身大小，还是按照手动设置的大小来作为自身大小。而WPF中对于这一冲突，统统采用的是，用手动设置的值来作为最后的大小。为什么使用统统，因为这种冲突会出现在很多自动布局的地方，比如说我们例子中使用的
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
这其实也是自动布局，一旦你对Column中放置的元素进行了大小设定。比如Width = 200之类的。Column中的元素就不会自动填充。
继续思考
不能交给window自己去控制大小，就只能手动去控制了呗。XAML部分把SizeToContent=WidthAndHeight去掉，再把C#做一些修改。
public partial class MainWindow : Window
{
private double rate;
public MainWindow()
{
InitializeComponent();
}
private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
if (target.Visibility == Visibility.Collapsed)
{
if(WindowState != WindowState.Maximized)
Width += target.Width;
target.Visibility = Visibility.Visible;
}
else
{
if (WindowState != WindowState.Maximized)
Width -= target.Width;
target.Visibility = Visibility.Collapsed;
}
}
再来看看效果
第二次尝试
看起来好多了，全屏不好录，不过也是能用的。
额外需求
另外，这里我自己还有一个需求，就是左边部分，缩放必须是等比率的。
解决也很简单，只要让窗体缩放是等比缩放就好了。再来改改C#代码。
public partial class MainWindow : Window
{
private double rate;
public MainWindow()
{
InitializeComponent();
rate = Width / Height;
SourceInitialized += Window_SourceInitialized;
}
private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
if (target.Visibility == Visibility.Collapsed)
{
if(WindowState != WindowState.Maximized)
Width += target.Width;
target.Visibility = Visibility.Visible;
}
else
{
if (WindowState != WindowState.Maximized)
Width -= target.Width;
target.Visibility = Visibility.Collapsed;
}
rate = Width / Height;
}
internal enum WM
{
WINDOWPOSCHANGING = 0x0046,
}
[StructLayout(LayoutKind.Sequential)]
internal struct WINDOWPOS
{
public IntPtr hwnd;
public IntPtr hwndInsertAfter;
public int x;
public int y;
public int cx;
public int cy;
public int flags;
}
private void Window_SourceInitialized(object sender, EventArgs ea)
{
HwndSource hwndSource = (HwndSource)HwndSource.FromVisual((Window)sender);
hwndSource.AddHook(DragHook);
}
private IntPtr DragHook(IntPtr hwnd, int msg, IntPtr wParam, IntPtr lParam, ref bool handeled)
{
switch ((WM)msg)
{
case WM.WINDOWPOSCHANGING:
{
WINDOWPOS pos = (WINDOWPOS)Marshal.PtrToStructure(lParam, typeof(WINDOWPOS));
if ((pos.flags & 0x0002) != 0)
{
return IntPtr.Zero;
}
Window wnd = (Window)HwndSource.FromHwnd(hwnd).RootVisual;
if (wnd == null)
{
return IntPtr.Zero;
}
var tx = (int)(pos.cy * rate);
var ty = (int)(pos.cx / rate);
if (tx < pos.cx)
pos.cx = tx;
else if (ty < pos.cy)
pos.cy = ty;
Marshal.StructureToPtr(pos, lParam, true);
handeled = true;
}
break;
}
return IntPtr.Zero;
}
}
这里使用的是windows本身的消息机制去使得窗体等比更改，比SizeChanged事件中去更改更加的顺滑。但是有一个问题没有解决，就是最大化的时候，竖直方向总是会超出屏幕40的高度。希望有解决办法的朋友能够提出来。
