概述
在Winform中從后臺添加控制元件相對比較容易,但是在WPF中,我們知道界面是通過XAML撰寫的,如何把后臺寫好的控制元件動態添加到前臺呢?本節舉例介紹這個問題,
這里要用到UniformGrid布局,UniformGrid 是一種橫向的網格分割、縱向的網格分割分別是均等的分割的布局型別.
?專案介紹
-. 這里界面添加一個ComboBox用來下拉選擇圖片數量;
-. 添加一個button用來執行圖片顯示;
dispaly下方是圖片顯示區域

代碼設計
-.前臺XAML代碼:
<Grid>
<dxlc:LayoutControl Orientation="Vertical">
<dxlc:LayoutGroup Orientation="Horizontal" View="GroupBox">
<dxlc:LayoutGroup.Header>
<dxlc:LayoutItem Label="Action" Background="#FF004486" Foreground="White"/>
</dxlc:LayoutGroup.Header>
<dxlc:LayoutItem Label="Image Count" >
<ComboBox SelectedIndex="{Binding ComSelectedIndex}">
<ComboBoxItem>2</ComboBoxItem>
<ComboBoxItem>4</ComboBoxItem>
<ComboBoxItem>6</ComboBoxItem>
</ComboBox>
</dxlc:LayoutItem>
<dxlc:LayoutItem >
<dx:SimpleButton Content="Image Dispaly" Background="LightGray"
cal:Message.Attach="[Event Click]=[btnAdd_Click($source,$eventArgs)]" />
</dxlc:LayoutItem>
</dxlc:LayoutGroup>
<dxlc:LayoutGroup Orientation="Horizontal" View="GroupBox">
<dxlc:LayoutGroup.Header>
<dxlc:LayoutItem Label="Dispaly" Background="#FF004486" Foreground="White"/>
</dxlc:LayoutGroup.Header>
<UniformGrid
cal:Message.Attach="[Event Loaded]=[UniformGrid_Loaded($source,$eventArgs)]" />
</dxlc:LayoutGroup>
</dxlc:LayoutControl>
</Grid>
前臺代碼比較簡單,只要關注下UniformGrid控制元件,系結了Loaded事件,
-.后臺代碼:
[AddINotifyPropertyChangedInterface]
public class UniformGridViewModel : Screen, IViewModel
{
public int ComSelectedIndex { get; set; }
public UniformGrid UniformGrid;
public string[] ImageFullPath;
public void btnAdd_Click(object sender, RoutedEventArgs e)
{
UniformGrid.Children.Clear();
UniformGrid.Columns = 2;
var count = 0;
switch(ComSelectedIndex)
{
case 0:
count = 2;break;
case 1:
count = 4; break;
case 2:
count = 6; break;
default: break;
}
for (int i = 0; i < count; i++)
{
Image image = new Image();
image.Source = LoadImageFreeze(ImageFullPath[i]);
image.MouseLeftButtonUp += ImageClick;
image.Name = Path.GetFileNameWithoutExtension(ImageFullPath[i]);
image.Margin = new Thickness(5);
UniformGrid.Children.Add(image);
}
}
public void ImageClick(object sender, MouseButtonEventArgs e)
{
var name = (sender as Image).Name;
MessageBox.Show($"當前選擇的圖片名稱:{name}");
}
public void UniformGrid_Loaded(object sender, RoutedEventArgs e)
{
UniformGrid = (UniformGrid)sender;
}
public UniformGridViewModel()
{
DisplayName = "UniformGrid";
string imagePath =Path.Combine( AppDomain.CurrentDomain.BaseDirectory, "Images");
ImageFullPath = Directory.GetFiles(imagePath, "*.png");
}
public static BitmapImage LoadImageFreeze(string imagePath)
{
try
{
var bitmap = new BitmapImage();
if (File.Exists(imagePath))
{
bitmap.BeginInit();
bitmap.CacheOption = BitmapCacheOption.OnLoad;
using (Stream ms = new MemoryStream(File.ReadAllBytes(imagePath)))
{
bitmap.StreamSource = ms;
bitmap.EndInit();
bitmap.Freeze();
}
}
return bitmap;
}
catch (Exception)
{
return null;
}
}
}
介紹:
①LoadImageFreeze:從路徑下加載圖片并轉換為BitmapImage;
②UniformGrid_Loaded;獲取UniformGrid物件;
③ImageFullPath:從專案bin下獲取圖片檔案并讀取到這個陣列;
④btnAdd_Click:界面button點擊事件,這里是核心的代碼,主要就是申城圖片,然后設定好 UniformGrid的行列以及其他屬性后添加到控制元件里面, UniformGrid.Children.Add(image);
⑤ImageClick:點擊后顯示圖片的名稱.

原始碼
百度網盤鏈接:https://pan.baidu.com/s/1iu2MovTGDoUd_HsTnI7mAA
提取碼:6666
技術群:添加小編微信并備注進群
小編微信:mm1552923 公眾號:dotNet編程大全
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/475285.html
標籤:.NET技术
上一篇:WPF中的依賴屬性
