We have a VS extension. The user uses a ToolWindowPane to interact with the extension. The height and width of the ToolWindowPane depends on how the user has their VS environment set up, and currently the contents of the ToolWindowPane does not resize properly.
So here is the window:
public class SymCalculationUtilitiesWindow : ToolWindowPane { /// <summary> /// Initializes a new instance of the <see cref="SymCalculationUtilitiesWindow"/> class. /// </summary> public SymCalculationUtilitiesWindow() : base(null) { this.Caption = "Sym Calculation Utilities"; this.ToolBar = new CommandID(new Guid(Guids.guidConnectCommandPackageCmdSet), Guids.SymToolbar); // This is the user control hosted by the tool window; Note that, even if this class implements IDisposable, // we are not calling Dispose on this object. This is because ToolWindowPane calls Dispose on // the object returned by the Content property. this.Content = new UtilitiesView(); } } So the UtilitiesView is the default view. Here is the xaml:
<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:Sym.VisualStudioExtension" x:Class="Sym.VisualStudioExtension.Engines.UtilitiesView" xmlns:engines="clr-namespace:Sym.VisualStudioExtension.Engines" Background="{DynamicResource VsBrush.Window}" Foreground="{DynamicResource VsBrush.WindowText}" mc:Ignorable="d" local:ViewModelLocator.AutoWireViewModel="True" x:Name="MyToolWindow" Height="800" Width="400"> <UserControl.Resources> <DataTemplate DataType="{x:Type engines:CalcEngineViewModel}"> <engines:CalcEngineView/> </DataTemplate> <DataTemplate DataType="{x:Type engines:TAEngineViewModel}"> <engines:TAEngineView/> </DataTemplate> </UserControl.Resources> <Grid> <Grid.RowDefinitions> <RowDefinition Height="auto" /> <RowDefinition Height="207*" /> <RowDefinition Height="593*"/> </Grid.RowDefinitions> <Grid x:Name="MainContent" Grid.Row="1" Grid.RowSpan="2"> <Grid.RowDefinitions> <RowDefinition Height="auto"/> <RowDefinition Height="auto"/> </Grid.RowDefinitions> <ContentControl Content="{Binding CurrentEngineViewModel}" Grid.RowSpan="2"/> </Grid> </Grid> and the user makes a choice which determines the CurrentEngineViewModel.
The following is the xaml of one of the possible CurrentEngineViewModels:
<UserControl x:Class="Sym.VisualStudioExtension.Engines.CalcEngineView" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:domain="clr-namespace:Sym.Engines.Calculation.Builder.Domain;assembly=Sym.Engines.Calculation" xmlns:core="clr-namespace:Sym.Core.Domain;assembly=Sym.Core" xmlns:helper="clr-namespace:Sym.VisualStudioExtension.Helper_Classes" xmlns:local="clr-namespace:Sym.VisualStudioExtension" local:ViewModelLocator.AutoWireViewModel="True" mc:Ignorable="d" d:DesignHeight="800" d:DesignWidth="400"> <UserControl.Resources> <ContextMenu> ... </ContextMenu> </UserControl.Resources> <Grid Margin="-20,-20,-20,-20"> <Grid.RowDefinitions> <RowDefinition Height="8*"/> </Grid.RowDefinitions> <TabControl x:Name="tabControl" HorizontalAlignment="Left" Height="617" Margin="20,54,0,0" VerticalAlignment="Top" Width="357"> <TabItem Header="Calculation Files"> <ListBox Name="CalcFilesListBox" Margin="20" ItemsSource="{Binding CalcFilesList}" ContextMenu="{StaticResource NewEditDeleteContextMenu}" Tag="{x:Type core:CalcFile}"> ... </ListBox> </TabItem> <TabItem Header="Template Files" Height="22" VerticalAlignment="Top"> <TreeView ItemsSource="{Binding TemplateFamilyList}" Margin="20" ContextMenu="{StaticResource NewEditDeleteContextMenu}" Tag="{x:Type domain:TemplateParameter}"> <TreeView.Resources> ... </TreeView.Resources> </TreeView> </TabItem> <TabItem Header="Advanced Calc Files"> <ListBox Margin="20" ItemsSource="{Binding AdvancedCalcFilesList}" ContextMenu="{StaticResource NewEditDeleteContextMenu}" Tag="{x:Type domain:TemplateCalculation}"> ... </ListBox> </TabItem> </TabControl> <Label x:Name="label" Content="{Binding Path=Title}" HorizontalAlignment="Left" Height="27" Margin="10,22,0,0" VerticalAlignment="Top" Width="367"/> </Grid> It seems to me that on the ToolWindowPane, there is a Grid, and on the Grid another Grid, and on that Grid, a Tabcontrol. From this post it seems that some controls do not resize. So would that mean that the TabControl can't resize even if it is on a Grid?
When the user resizes the ToolWindowPane, the contents does not resize. How can I achieve correct resizing in this situation?
2 Answers
Answers 1
To make the page salable across resolutions/devices, you must ensure that there are no fixed width/height property specified; instead we can use them in percentage (%) which will make the controls scale based on available viewport. Try replacing all the fixed height & width properties for your control with percentages.
if for some reasons the controls are getting squeezed you can try providing minHeight & minWidth to the control as documented here https://www.w3schools.com/cssref/pr_dim_min-height.asp
Answers 2
The base of the problem is the explicit Width and Height values are being set and preventing the controls from fitting into their container.
0 comments:
Post a Comment