WPF 控件专题 ViewBox 控件详解

最新推荐文章于 2024-06-13 14:44:48 发布

^@^lemon tea^@^

最新推荐文章于 2024-06-13 14:44:48 发布

阅读量6.6k

点赞数 7

本文链接：https://blog.csdn.net/BYH371256/article/details/125371768

版权

WPF 控件专题专栏收录该内容

53 篇文章 94 订阅

订阅专栏

1、ViewBox 介绍

官方释义：定义一个内容修饰器，以便拉伸或缩放单一子项使其填满可用的控件。

这个控件通常和其他控件结合一起使用的，是WPF中非常有用的控件，ViewBox组件的作用是拉伸或延展位于其中的组件，以填满可用空间，使之有更好的布局及视觉效果。

一个ViewBox控件中只能添加一个子项，多写就会报错。

**************************************************************************************************************

2、常用属性介绍

Child：获取或设置一个ViewBox元素的单一子元素。

   Stretch：获取或设置拉伸模式以决定该组件中的内容以怎样的形式填充该组件的已有空间。具体值如下
       None：内容保持其原始大小。
       Fill：调整内容的大小以填充目标尺寸。不保留纵横比。
       Uniform：在保留内容原有纵横比的同时调整内容的大小，以适合目标尺寸。
       UniformToFill：在保留内容原有纵横比的同时调整内容的大小，以填充目标尺寸。如果目标矩形的纵横比不同于源矩形的纵横比，则对源内容进行剪裁以适合目标尺寸。

   StretchDirection：获取或设置该组件的拉伸方向以决定该组件中的内容将以何种形式被延展。描述缩放如何应用于内容，以及如何将缩放限制到指定的轴类型。具体值如下：
       UpOnly：仅当内容小于父项时，它才会放大。如果内容大于父项，不会执行任何缩小操作。
       DownOnly：仅当内容大于父项时，它才会缩小。如果内容小于父项，不会执行任何放大操作。
       Both：内容根据 System.Windows.Media.Stretch 模式进行拉伸以适合父项的大小。

**************************************************************************************************************

3、具体代码示例

<!--不是用ViewBox代码示例-->
<Window x:Class="WPFControlsTest.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:WPFControlsTest"
        mc:Ignorable="d" Background="#2d323c" Foreground="#dddddd"
        Title="MainWindow" Height="300" Width="620">
    <StackPanel Margin="10">
        <TextBlock Text="秋风清，秋月明，落叶聚还散，寒鸦栖复惊，相思相见知何日，此时此夜难为情。" FontSize="15" Foreground="#dddddd"/>
        <Button Content="李白《秋风词 》" Width="150"  />
    </StackPanel>
</Window>


<!--使用ViewBox代码示例， Stretch值为Fill-->
<Viewbox Stretch="Fill" Height="200">
	<StackPanel Margin="10">
		<TextBlock Text="秋风清，秋月明，落叶聚还散，寒鸦栖复惊，相思相见知何日，此时此夜难为情。" FontSize="15" Foreground="#dddddd"/>
		<Button Content="李白《秋风词 》" Width="150"  />
	</StackPanel>
</Viewbox>

<!--使用ViewBox代码示例， Stretch值为Uniform-->
<Viewbox Stretch="Uniform" Height="200">
	<StackPanel Margin="10">
		<TextBlock Text="秋风清，秋月明，落叶聚还散，寒鸦栖复惊，相思相见知何日，此时此夜难为情。" FontSize="15" Foreground="#dddddd"/>
		<Button Content="李白《秋风词 》" Width="150"  />
	</StackPanel>
</Viewbox>

<!--使用ViewBox代码示例， Stretch值为UniformToFill-->
<Viewbox Stretch="UniformToFill" Height="200">
	<StackPanel Margin="10">
		<TextBlock Text="秋风清，秋月明，落叶聚还散，寒鸦栖复惊，相思相见知何日，此时此夜难为情。" FontSize="15" Foreground="#dddddd"/>
		<Button Content="李白《秋风词 》" Width="150"  />
	</StackPanel>
</Viewbox>

**************************************************************************************************************

4、效果图：左侧图像不使用ViewBox的效果图；右侧图像使用viewbox控件，Stretch设置为Fill的效果图；