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

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

前台:

<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();
}
}