I have an UserControl that contains an Expander and it contains a ContentControl. But when I call the control in the MainWindow, the vertical bar of the ScrollViewer does not appear, and the content is out of frame.
The Control XAML
<UserControl x:Class="UserControlMenuItem"
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:Core"
xmlns:md="http://materialdesigninxaml.net/winfx/xaml/themes"
mc:Ignorable="d" >
<Grid>
<md:PackIcon Kind="{Binding Path=Icon}" Width="15" Height="15" Margin="10 16" Foreground="{DynamicResource PrimaryHueMidForegroundBrush}"/>
<!--<ListViewItem x:Name="ListViewItemMenu" Content="{Binding Path=Header}" Padding="37 14" FontSize="15" Foreground="{DynamicResource PrimaryHueMidForegroundBrush}"/>-->
<Expander x:Name="ExpanderMenu" Header="{Binding Path=Header}" IsExpanded="False" Width="210" HorizontalAlignment="Right" Background="{x:Null}" Foreground="{DynamicResource PrimaryHueMidForegroundBrush}">
<ContentControl Content="{Binding ListView}"/>
</Expander>
</Grid>
</UserControl>
The UserControl C# code
public partial class UserControlMenuItem : UserControl
{
//MainWindow _context;
public static readonly DependencyProperty HeaderProperty = DependencyProperty.Register("Header", typeof(string), typeof(UserControlMenuItem));
public string Header
{
get
{
return (string)GetValue(HeaderProperty);
}
set
{
SetValue(HeaderProperty, value);
}
}
public static readonly DependencyProperty IconProperty = DependencyProperty.Register("Icon", typeof(PackIconKind), typeof(UserControlMenuItem));
public PackIconKind Icon
{
get
{
return (PackIconKind)GetValue(IconProperty);
}
set
{
SetValue(IconProperty, value);
}
}
public static readonly DependencyProperty ListViewProperty = DependencyProperty.Register("ListView", typeof(ListView), typeof(UserControlMenuItem), new UIPropertyMetadata(null));
public ListView ListView
{
get
{
return (ListView)GetValue(ListViewProperty);
}
set
{
SetValue(ListViewProperty, value);
}
}
public UserControlMenuItem()
{
InitializeComponent();
DataContext = this;
}
}
Calling the UserControl inside the ScrollViewer
<ScrollViewer HorizontalAlignment="Stretch" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<StackPanel Orientation="Vertical">
<core:UserControlMenuItem x:Name="MenuItemHome" Header="Home" Icon="Home">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" SelectedIndex="0" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Home.Views.Home}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Home" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Palette.Views.PaletteSelector}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Palette" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Data" Icon="ViewList">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:DataGrid.Views.DataGridView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="DataGrid" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:DataGrid.Views.MultiColumnComboBoxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Multi-Column ComboBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:CollectionControl.Views.CollectionControlView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="CollectionControl" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:CheckLists.Views.CheckListsView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Check List" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:PropertyGrid.Views.PropertyGridSelectedObjectView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="PropertyGrid (Using selected object(s))" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:WatermarkComboBox.Views.WatermarkComboBoxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="WatermarkComboBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:ExtTabControl.Views.ExtTabControlView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="ExtendedTabControl" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Input Fields" Icon="Input">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Numeric.Views.NumericView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Numeric" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:DateTime.Views.DateTimeView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="DateTime" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:TimeSpan.Views.TimeSpanView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="TimeSpan" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Color.Views.ColorView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Color" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:FilePicker.Views.FilePickerView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="FilePicker" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:RangeSlider.Views.RangeSliderView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="RangeSlider" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:ToggleSwitch.Views.ToggleSwitchView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="ToggleSwitch" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Button.Views.ButtonSpinnerView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Enumeration" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Text" Icon="TextBox">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.AutoSelectTextboxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="AutoSelectTextBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.MaskedTextboxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="MaskedTextBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.MultiLineTextEditorView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="MultiLineTextEditor" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.RichTextboxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="RichTextBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.WatermarkTextboxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="WatermarkTextBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.WatermarkPasswordBoxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="WatermarkPasswordBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Text.Views.TokenizedTextBoxView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="TokenizedTextBox" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Buttons" Icon="Button">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Button.Views.DropDownSplitButtonView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="DropDown and Split Buttons" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Button.Views.IconButtonView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="IconButton" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Windows" Icon="DesktopWindows">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Window.Views.ChildWindowView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="ChildWindow" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Window.Views.WindowContainerView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="WindowContainer" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Productivity" Icon="ChartBar">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:BusyIndicator.Views.BusyIndicatorView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="BusyIndicator" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:BusyIndicator.Views.BusyIndicatorCustomContentView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="BusyIndicator Custom Content" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:BusyIndicator.Views.BusyIndicatorCustomContentTemplateView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="BusyIndicator Custom Content Template" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Calculator.Views.CalculatorView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Calculator" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:Wizard.Views.WizardView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="Wizard" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:MultiCalendar.Views.MultiCalendarView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="MultiCalendar" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
<core:UserControlMenuItem Header="Others" Icon="FilterList">
<core:UserControlMenuItem.ListView>
<ListView Margin="0 16 0 16" PreviewMouseLeftButtonUp="ListBox_PreviewMouseLeftButtonUp">
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:AvalonDock.Views.AvalonDockView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="AvalonDock" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
<core:LiveExplorerListBoxItem SampleType="{x:Type samples:SlideShow.Views.SlideShowView}" Style="{StaticResource MaterialDesignListBoxItem2}" PreviewMouseDown="LiveExplorerListBoxItem_PreviewMouseDown">
<TextBlock Text="SlideShow" Margin="10 5"/>
</core:LiveExplorerListBoxItem>
</ListView>
</core:UserControlMenuItem.ListView>
</core:UserControlMenuItem>
</StackPanel>
</ScrollViewer>
And the implementing of LiveExplorerListBoxItem it´s a ListViewItem but the name is ListBox because earlier was a ListBoxItem.
public class LiveExplorerListBoxItem: ListViewItem
{
#region Properties
#region IsNewFeature
public static readonly DependencyProperty IsNewFeatureProperty = DependencyProperty.Register("IsNewFeature", typeof(bool), typeof(LiveExplorerListBoxItem), new UIPropertyMetadata(false));
public bool IsNewFeature
{
get
{
return (bool)GetValue(IsNewFeatureProperty);
}
set
{
SetValue(IsNewFeatureProperty, value);
}
}
#endregion //IsNewFeature
#region IsPlusOnlyFeature
public static readonly DependencyProperty IsPlusOnlyFeatureProperty = DependencyProperty.Register("IsPlusOnlyFeature", typeof(bool), typeof(LiveExplorerListBoxItem), new UIPropertyMetadata(false));
public bool IsPlusOnlyFeature
{
get
{
return (bool)GetValue(IsPlusOnlyFeatureProperty);
}
set
{
SetValue(IsPlusOnlyFeatureProperty, value);
}
}
#endregion //IsPlusOnlyFeature
#region SampleType
public static readonly DependencyProperty SampleTypeProperty = DependencyProperty.Register("SampleType", typeof(Type), typeof(LiveExplorerListBoxItem), new UIPropertyMetadata(null));
public Type SampleType
{
get
{
return (Type)GetValue(SampleTypeProperty);
}
set
{
SetValue(SampleTypeProperty, value);
}
}
#endregion //Sample
#endregion //Properties
#region Methods
protected override void OnMouseLeftButtonDown(System.Windows.Input.MouseButtonEventArgs e)
{
//# If the node does not have any sample associated, toggle it's expansion on single click
if (this.SampleType == null)
{
this.IsSelected = !this.IsSelected;
}
else
{
this.IsSelected = true;
}
e.Handled = true;
}
#endregion
}
I found it, is because I must insert the ScrollViewer inside a Grid and I have it inside a StackPanel