如何在WPF中设置较小的扩展器标题和加宽内容？
如何在WPF中设置较小的扩展器标题和加宽内容？
提问于 2019-03-11 15:52:44
我正在创建一个定制的虚拟键盘。目前，对于所有标点符号，我将其设置在另一个网格上。扩展器内容似乎可以保持标点符号视图。但目前，它需要设置内容的大小，如果我想让扩展器内容能够查看里面的内容。
我怎么做才能有按钮大小的扩展器，当点击时，内容将扩展到它的更宽的尺寸？
如何使扩展器的大小如下图所示(黄色矩形)，但当单击扩展器时，内容会像GIF一样扩展？
<Button HorizontalAlignment="Left" Height="52.25" Margin="0,238.5,0,0" VerticalAlignment="Top" Width="168.187" Background="#FF3C3C3C" FontFamily="Arial" FontSize="18" BorderBrush="#FF6E6E6E">
<Expander Header="?!#" ExpandDirection="Up" Background="{x:Null}" Foreground="White" HorizontalAlignment="Left" VerticalAlignment="Top">
<!-- How add content grid which can be expander at full while maintaining the expander header to small size? -->
</Expander>
</Button>回答 1
Stack Overflow用户
回答已采纳
发布于 2019-03-11 18:02:26
我建议您将扩展键盘的Button放入另一个Panel中，并使用ToggleButton控制Panel的Visibility。
当您使用Expander (如您所做的那样)来容纳扩展键盘时，可以很容易地做到这一点，如下所示：
<Grid Background="Gray" Height="300">
<!-- Basic Keyboard Buttons can be placed here -->
<Button HorizontalAlignment="Left" Margin="0,0,0,30" VerticalAlignment="Top" Content="Put some Buttons from the BASIC Keyboard here"/>
<!-- Button to bring the extanded Keyboard into view -->
<ToggleButton x:Name="ExtendedKeyboardActive" HorizontalAlignment="Left" VerticalAlignment="Center" Content="?!#" Width="50"/>
<!-- Extended Keyboard (Note: I would rather use a simple <Grid/> instead of an <Expander/> but it is up to you)-->
<Expander VerticalAlignment="Bottom" ExpandDirection="Up" IsExpanded="{Binding IsChecked, ElementName=ExtendedKeyboardActive}" Background="LightGray">
<Grid Height="300">
<!-- Content of the extaned Keyboard -->
<Button HorizontalAlignment="Left" Margin="0,0,0,30" VerticalAlignment="Top" Content="Put some Buttons from the EXTENDED Keyboard here"/>
<!-- Button ti hide the extended Keyboard (optional if it the 'ExtendedKeyboardActive' is not covered over by the extended Keyboard Grid) -->
<ToggleButton IsChecked="{Binding IsChecked, ElementName=ExtendedKeyboardActive}" Width="50" HorizontalAlignment="Left" VerticalAlignment="Center" Content="ABC" />
</Grid>
</Expander>
</Grid>或者你可以使用PopUp，因为Expander有这个箭头圈的东西，它总是显示的，并不是真正需要的(感谢@Bradley Uffner)。
<Grid Background="Gray">
<!-- Basic Keyboard Buttons can be placed here -->
<Button HorizontalAlignment="Left" Margin="0,0,0,30" VerticalAlignment="Bottom" Content="Put some Buttons from the BASIC Keyboard here"/>
<!-- Button to bring the extanded Keyboard into view -->
<ToggleButton x:Name="ExtendedKeyboardActive" HorizontalAlignment="Left" VerticalAlignment="Bottom" Content="?!#" Width="50"/>
<!-- Extended Keyboard -->
<Popup IsOpen="{Binding IsChecked, ElementName=ExtendedKeyboardActive}" Placement="Center" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type Grid}}}" Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type Grid}}}">
<Grid Background="LightGray">
<!-- Content of the extended Keyboard -->
<Button HorizontalAlignment="Left" Margin="0,0,0,30" VerticalAlignment="Bottom" Content="Put some Buttons from the extended Keyboard here"/>
<!-- Button to go back to the basic Keyboard -->
<ToggleButton IsChecked="{Binding IsChecked, ElementName=ExtendedKeyboardActive}" Width="50" HorizontalAlignment="Left" VerticalAlignment="Bottom" Content="ABC" />
</Grid>
</Popup>
</Grid>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55097337
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号