CODEWITHSUNDEEP
c#wpflistbox
Jamaxack
Jamaxack

Reputation: 2460

WPF: ListBox item show from bottom to top

I think title is not clear I am working with WPF and creating custom Messages control. I have message User Control and the message user controls showing in custom Messages control[ListBox]. XAML code:

 <ListBox x:Name="uiMessages" ItemsSource="{Binding Path=Messages}">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel Orientation="Horizontal" IsItemsHost="True" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <wpfMessages:MessageDisplay>

                    </wpfMessages:MessageDisplay>
                </DataTemplate>
            </ListBox.ItemTemplate>
</ListBox>

Current view:

enter image description here

Expected:

enter image description here

Now list box item is showing from top to bottom and after red message there empty space. I will be good whem the 2 green messages will bi in bottom and red one in top. Expected is add messages from botton to top no from top to botton like now. enter image description here

any Ideas?

Thanks in advance Jamaxack!

Upvotes: 1

Views: 2657

Answers (2)

Jamaxack
Jamaxack

Reputation: 2460

Created custom WrapPanel that reverses Elements

XAML code:

 <ListBox x:Name="uiMessages" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
         <ListBox.ItemsPanel>
              <ItemsPanelTemplate>
                   <wpf:ReverseWrapPanel Orientation="Horizontal"/>
              </ItemsPanelTemplate>
         </ListBox.ItemsPanel>
   </ListBox>

Code behind:

  public class ReverseWrapPanel : WrapPanel
    {
        public new Orientation Orientation { get { return base.Orientation; } set { base.Orientation = value; ResetAll(); } }

        /// <summary>
        /// The opposite of the Orientation property.
        /// </summary>
        Orientation FlipDirection { get { return Orientation == Orientation.Horizontal ? Orientation.Vertical : Orientation.Horizontal; } }

        public ReverseWrapPanel()
        {
            Initialized += ReverseWrapPanel_Initialized;
        }

        void ReverseWrapPanel_Initialized(object sender, System.EventArgs e)
        {
            this.Mirror(FlipDirection);
        }

        protected override void OnVisualChildrenChanged(DependencyObject visualAdded, DependencyObject visualRemoved)
        {
            base.OnVisualChildrenChanged(visualAdded, visualRemoved);

            foreach (UIElement child in Children.OfType<UIElement>())
            {
                child.Mirror(FlipDirection);
            }
        }

        void ResetAll()
        {
            this.Mirror(FlipDirection);

            foreach (UIElement child in Children.OfType<UIElement>())
            {
                child.Mirror(FlipDirection);
            }
        }
    }

Thanx Jamshed!

Upvotes: 2

Edward Eisenhart
Edward Eisenhart

Reputation: 390

It is a little unclear but I think you want to change the ItemsPanel Layout.

<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <VirtualizingStackPanel VerticalAlignment="Bottom"/>
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>

Upvotes: 4

Related Questions