WPf 带滚动条WrapPanel 自动换行 和控件右键菜单

原文:WPf 带滚动条WrapPanel 自动换行 和控件右键菜单

技能点包括 WPf 样式的引用 数据的验证和绑定 比较适合初学者

前台：

 <Window.Resources>





        <local:PathToSource x:Key="n2"/>





        <Style x:Key="{x:Type ContextMenu}" TargetType="{x:Type ContextMenu}">





            <Setter Property="OverridesDefaultStyle" Value="True"/>





            <Setter Property="SnapsToDevicePixels" Value="True"/>





            <Setter Property="Template">





                <Setter.Value>





                    <ControlTemplate TargetType="{x:Type ContextMenu}">





                        <Border Background="#CD222120" CornerRadius="7, 7, 8, 8" BorderBrush="DarkGray" BorderThickness="2" Opacity="0.96">





                            <StackPanel ClipToBounds="True" Orientation="Vertical" IsItemsHost="True" Margin="5,4,5,4"/>





                        </Border>





                    </ControlTemplate>





                </Setter.Value>





            </Setter>





        </Style>





        <ControlTemplate x:Key="{x:Static MenuItem.TopLevelItemTemplateKey}" TargetType="{x:Type MenuItem}">





            <Border Name="Border" >





                <Grid>





                    <ContentPresenter Margin="6,3,6,3" ContentSource="Header" RecognizesAccessKey="True" />





                </Grid>





            </Border>





        </ControlTemplate>





 





        <DataTemplate x:Key="Wrapitem">





            <Grid  Height="86"   Width="86"  >





                <Grid.ContextMenu>





                    <ContextMenu Name="cm" StaysOpen="true">





                        <MenuItem Header="update"/>





                        <MenuItem Header="Save"/>





                        <MenuItem Header="SaveAs"/>





                    </ContextMenu>





 





                </Grid.ContextMenu>





                <Image Margin="8,8,8,24" Source="{Binding Path=Url,Converter={StaticResource n2}}"/>





                <Label Content="{Binding Path=Text}" Height="22" Width="45"   VerticalAlignment="Bottom"/>





    	</Grid>





            





        </DataTemplate>





    </Window.Resources>





    <Grid>





        <ListBox x:Name="list" Margin="124,63,109,44"  ScrollViewer.HorizontalScrollBarVisibility="Hidden"   ItemTemplate="{StaticResource Wrapitem}">





            <ListBox.Resources>





                <Style TargetType="ListBoxItem">





 





                    <Style.Resources>





 





                        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FFA1A1A1"/>





                    </Style.Resources>





                </Style>





            </ListBox.Resources>





 





         





                <!--<ListBox.ItemsPanel >





    			<ItemsPanelTemplate>





                    <WrapPanel   Orientation="Horizontal" IsItemsHost="True"/>





				</ItemsPanelTemplate>





    		





			</ListBox.ItemsPanel>-->





            <ListBox.Template>





                <ControlTemplate TargetType="{x:Type ListBox}">





                    <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">





                        <WrapPanel Orientation="Horizontal" IsItemsHost="True" ScrollViewer.CanContentScroll="True"/>





                    </ScrollViewer>





                </ControlTemplate>





            </ListBox.Template>





        </ListBox>





   





    





        





    </Grid>





</Window>

后台：

   /// <summary>





    /// MainWindow.xaml 的交互逻辑





    /// </summary>





    public partial class MainWindow : Window





    {





        public MainWindow()





        {





            InitializeComponent();





            load();





        }





 





        public void load() 





        {





            ObservableCollection<Mean> ListMean = new ObservableCollection<Mean>() 





            {





                 new Mean(){Text="001",Url="i"},





                 new Mean(){Text="002",Url="i"},





                 new Mean(){Text="003",Url="ii"},





                 new Mean(){Text="004",Url="i"},





                 new Mean(){Text="005",Url="i"},





                 new Mean(){Text="006",Url="ii"},





                 new Mean(){Text="007",Url="i"},





                 new Mean(){Text="008",Url="i"},





                 new Mean(){Text="009",Url="i"},





                 new Mean(){Text="010",Url="i"},





                 new Mean(){Text="011",Url="ii"},





                 new Mean(){Text="012",Url="i"},





                 new Mean(){Text="013",Url="i"},





                 new Mean(){Text="014",Url="i"},





                 new Mean(){Text="015",Url="i"},





                 new Mean(){Text="016",Url="i"},  





                 new Mean(){Text="017",Url="i"}





            };





            list.ItemsSource = ListMean;





        }





    }





    public class Mean : INotifyPropertyChanged





    {





        private string text;





 





        public string Text





        {





            get { return text; }





            set { text = value; OnPropertyChanged("Text"); }





        }





        private string url;





 





        public string Url





        {





            get { return url; }





            set { url = value; OnPropertyChanged("Url"); }





        }





 





        public event PropertyChangedEventHandler PropertyChanged;





 





        public void OnPropertyChanged(string propertyName)





        {





 





            if (PropertyChanged != null)





            {





 





                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));





 





            }





 





        }





    }





    public class PathToSource:IValueConverter





    {





       public object Convert(object value, Type targetType, object parameter, CultureInfo culture)





       {





         





           string url = string.Format(@"/Images/{0}.jpg", (string)value=="i"?"i":"ii");





           return new BitmapImage(new Uri(url,UriKind.Relative));





       }





       public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 





       {





           throw new NotImplementedException();





       }





    }