Open a new panel view within a dockpane when dockpane button is clicked

01-06-2022 03:07 PM
by Anonymous User
Not applicable

I am creating a Pro SDK 2.9 add-in that utilizes a dockpane. I have my dockpane set up with tabs similar to the Esri Custom Catalog sample ( and each tab displays a custom control, similar to how each tab in the sample displays a string. One custom control contains a button that when clicked should replace the current custom control with a new one.

For example, the original custom control lists all current projects and also has a button that says "Create New Project". When that button is clicked, I want a new custom control that contains all the project options to appear and for the list of projects to no longer be visible. I have created the xaml for this replacement custom control and call it via the button ICommand, but nothing ever displays.

Below is the code from the MyProjectViewModel which is a PanelViewModelBase class (see sample).

private CreateProjectViewModel _createProjectPanel;
public MyProjectsViewModel()
_createProjectPanel = new CreateProjectViewModel();
_createProjectCommand = new RelayCommand(() => CreateProject(), () => true);

private readonly ICommand _createProjectCommand;
public ICommand CreateProjectCommand => _createProjectCommand;

private void CreateProject()
// this doesn't work
ProjectsViewModel pvm = new ProjectsViewModel();
pvm.SelectedProjectsPanelHeaderIndex = 0;
pvm.CurrentSubPanelPage = _createProjectPanel;

Here is the xaml code where I have the CreateProjectCommand and DataTemplate for the CreateProjectViewModel:

<extensions:DesignOnlyResourceDictionary Source="pack://application:,,,/ArcGIS.Desktop.Framework;component\Themes\Default.xaml"/>
<DataTemplate DataType="{x:Type viewModel:CreateProjectViewModel}">
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
<StackPanel Grid.Row="0" Background="Transparent">
<DockPanel Margin="6,6" LastChildFill="True">
<TextBlock Style="{DynamicResource Esri_TextBlockRegular}" Margin="6,0,0,0">Sort By:</TextBlock>
<ComboBox ItemsSource="{Binding ProjectSortCriteria}" SelectedItem="{Binding SelectedSortCriteria, Mode=TwoWay}" SelectedIndex="0" Margin="6,0,0,0"></ComboBox>
<Grid Grid.Row="1" Background="Transparent">
<ListBox Name="MyProjectsListBox" Margin="6,0" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Disabled"
ItemContainerStyle="{DynamicResource Esri_ListBoxItemHighlightBrush}"
SelectedItem="{Binding Path=SelectedProjectName}" ItemsSource="{Binding Path=ProjectNames}" Grid.ColumnSpan="2">
<Style TargetType="{x:Type ListBox}">
<WrapPanel Orientation="Vertical"/>
<StackPanel Grid.Row="2" Background="Transparent">
<Button Command="{Binding CreateProjectCommand}" Content="Create Project" Style="{DynamicResource Esri_Button}" Margin="10" HorizontalAlignment="Left"/>

0 Kudos
2 Replies
Esri Regular Contributor


I have attached one of your mentioned CustomCatalog project files. You can put it on top of existing file and check it is what you want.

To create new panel use dockpane burger button menu item.



Fell free to ask if something is unclear.

0 Kudos
by Anonymous User
Not applicable


It looks like your solution adds a new tab, but I would like to replace or cover the content of an existing tab. For example, in the Custom Catalog sample, I would like to click the dockpane burger button menu item and that would replace the content of the current tab with new content. I hope that explains my issue better.

Thank you

0 Kudos