XamMultiColumnComboEditor in XamRibbon.ApplicationMenu2010 issue

Hello Mike, Thank you for looking into this.

I am unable to see your sample code. Please see my sample code below. The sample code items causes vertical and horizontal scroll bar to display and only the first column of the combobox to show. You have to use the horizontal scroll bar to scroll through the other columns.

I have the identical code in a user control within an grid and I'm not having this issue. I am only seeing this behavior occur in ApplicationMenu2010Item.Content.

Thank you.

MainWindow.xaml

   <ribbon:RibbonWindowContentHost>
        <ribbon:RibbonWindowContentHost.Ribbon>
            <ribbon:XamRibbon Grid.Row="0" Name="xamRibbon1" ApplicationMenuMode="Office2010" ApplicationAccentColor="LightGreen" 
                              VerticalAlignment="Top" HorizontalAlignment="Stretch" >
                <ribbon:XamRibbon.Resources>

                </ribbon:XamRibbon.Resources>
                <ribbon:XamRibbon.ApplicationMenu2010 >
                    <ribbon:ApplicationMenu2010  Caption="Home">
                        <ribbon:ApplicationMenu2010.Items >
                            <ribbon:ApplicationMenu2010Item Header="Tab 1">
                                <ribbon:ApplicationMenu2010Item.Content>
                                    <Grid>
        <ig:XamMultiColumnComboEditor x:Name="xamMultiColumnComboEditor1"
                                      Width="75" Height="25"
                                      ItemsSource="{Binding Path=Data}"
                                      DisplayMemberPath="Name"
                                      AutoGenerateColumns="False" 
                                      DropDownOpened="xamMultiColumnComboEditor1_DropDownOpened">
            <ig:XamMultiColumnComboEditor.Columns>
                <ig:TextComboColumn Key="Value"/>
                <ig:TextComboColumn Key="Name"/>
                <ig:ImageComboColumn Key="ImagePath"/>
            </ig:XamMultiColumnComboEditor.Columns>
        </ig:XamMultiColumnComboEditor>
    </Grid>
                                </ribbon:ApplicationMenu2010Item.Content>
                            </ribbon:ApplicationMenu2010Item>
                        </ribbon:ApplicationMenu2010.Items>
                    </ribbon:ApplicationMenu2010>
                </ribbon:XamRibbon.ApplicationMenu2010>
            </ribbon:XamRibbon>
        </ribbon:RibbonWindowContentHost.Ribbon>
    </ribbon:RibbonWindowContentHost>

MainWindow.xaml.cs

        private void xamMultiColumnComboEditor1_DropDownOpened(object sender, EventArgs e)
        {
            // The border controls the size of the drop down
            Border border = GetXamMultiColumnComboEditorBorder(sender as XamMultiColumnComboEditor);

            Grid grid = border.Child as Grid;

            // Get child items panel
            MultiColumnComboItemsPanel gridItemsPanel = grid.Children[0] as MultiColumnComboItemsPanel;

            // Add Loaded event
            gridItemsPanel.Loaded -= gridItemsPanel_Loaded;
            gridItemsPanel.Loaded += gridItemsPanel_Loaded;
        }
        private void gridItemsPanel_Loaded(object sender, RoutedEventArgs e)
        {
            MultiColumnComboItemsPanel itemsPanel = sender as MultiColumnComboItemsPanel;
            itemsPanel.Measure(new Size(double.PositiveInfinity, double.PositiveInfinity));

            // Get the border and set the desired width
            Border border = GetXamMultiColumnComboEditorBorder(xamMultiColumnComboEditor1);
            border.MinWidth = itemsPanel.DesiredSize.Width + 5;	// +5 for extra padding
            border.MinHeight = 30;
        }

        private Border GetXamMultiColumnComboEditorBorder(XamMultiColumnComboEditor editor)
        {
            // Get Popup
            Popup popup = Utilities.GetDescendantFromType(editor as DependencyObject, typeof(Popup), true) as Popup;

            // Get Grid
            Grid grid = popup.Child as Grid;

            return grid.Children[0] as Border;
        }

MainWindowViewModel.cs

  public class MainWindowViewModel
    {
        // This is the data that gets bound to the ItemsSource property in the XamMultiColumnComboEditors
        public SampleTestDataForComboEditor Data { get; set; }

        // Constructor for the view model.
        public MainWindowViewModel()
        {
            // Instantiate the data.
            Data = new SampleTestDataForComboEditor();
        }
    }
 public class SampleTestDataForComboEditor : ObservableCollection<SampleData>
    {
        public SampleTestDataForComboEditor()
        {
            Add(new SampleData(1265454, "This is a really long string number one."));
            Add(new SampleData(94654542, "This is a really long string number two."));
            Add(new SampleData(657575, "This is a really long string number three."));
            Add(new SampleData(987543478, "This is a really long string number four."));
            Add(new SampleData(789451271, "This is a really long string number five."));
            Add(new SampleData(789451, "This is a really long string."));
            Add(new SampleData(789452, "This is a really long string."));
            Add(new SampleData(789453, "This is a really long string."));
            Add(new SampleData(789454, "This is a really long string."));
            Add(new SampleData(789455, "This is a really long string."));
            Add(new SampleData(789456, "This is a really long string."));
            Add(new SampleData(789457, "This is a really long string."));
            Add(new SampleData(789458, "This is a really long string."));
            Add(new SampleData(789459, "This is a really long string."));
            Add(new SampleData(7894510, "This is a really long string."));

        }
    }

    public class SampleData
    {
        public int Value { get; set; }

        public string Name { get; set; }

        public string ImagePath { get; set; }

        public SampleData(int val, string name)
        {
            this.Value = val;
            this.Name = name;
  //          this.ImagePath = "Assets/img.png";
        }
    }

Top Replies