2018/10/17

[C#] WPF Object Array

在寫WPF的介面時,如果需要用到大量相同的物件,比較直接的方法就是在xaml裡面一直複製貼上程式碼。

像是如果要顯示出一排一樣的圖片像這樣:

在xmal裡面最直接的寫法就是像這樣寫一堆一樣的程式碼:
  1. <Grid>
  2. <Canvas x:Name="CanvasWindow" Height="400" VerticalAlignment="Top" HorizontalAlignment="Left" Width="500" >
  3. <Image x:Name="img01" Canvas.Left="0" Height="100" Width="100" Source="Image/mouse.png" Stretch="Fill" Visibility="Visible" Canvas.Top="0"/>
  4. <Image x:Name="img02" Canvas.Left="100" Height="100" Width="100" Source="Image/mouse.png" Stretch="Fill" Visibility="Visible" Canvas.Top="0"/>
  5. <Image x:Name="img03" Canvas.Left="200" Height="100" Width="100" Source="Image/mouse.png" Stretch="Fill" Visibility="Visible" Canvas.Top="0"/>
  6. <Image x:Name="img04" Canvas.Left="0" Height="100" Width="100" Source="Image/mouse.png" Stretch="Fill" Visibility="Visible" Canvas.Top="100"/>
  7. <Image x:Name="img05" Canvas.Left="100" Height="100" Width="100" Source="Image/mouse.png" Stretch="Fill" Visibility="Visible" Canvas.Top="100"/>
  8. <Image x:Name="img06" Canvas.Left="200" Height="100" Width="100" Source="Image/mouse.png" Stretch="Fill" Visibility="Visible" Canvas.Top="100"/>
  9. </Canvas>
  10. </Grid>


但是如果不想把程式碼都寫在xmal裡面的話,也可以在cs檔裡面用array程式碼搞定:
  1. private Image[] images;
  2. public MainWindow()
  3. {
  4. InitializeComponent();
  5. images = new Image[6];
  6. for (int i = 0; i < images.Length; i++)
  7. {
  8. images[i] = new Image();
  9. images[i].Source = new BitmapImage(new Uri(@"Image/mouse.png", UriKind.Relative));
  10. images[i].Width = 100;
  11. images[i].Height = 100;
  12. images[i].Stretch = Stretch.Fill;
  13. images[i].Visibility = Visibility.Visible;
  14. CanvasWindow.Children.Add(images[i]);
  15. Canvas.SetLeft(images[i], (100 * i));
  16. Canvas.SetTop(images[i], 0);
  17. }
  18. }

如果要畫二維陣列的圖像這樣:

cs程式碼可以這樣寫:
  1. static int array_x = 3, array_y = 2;
  2. private Image[,] images;
  3. public MainWindow()
  4. {
  5. InitializeComponent();
  6. images = new Image[array_y,array_x];
  7. for (int j = 0; j < array_y; j++)
  8. {
  9. for (int i = 0; i < array_x; i++)
  10. {
  11. images[j,i] = new Image();
  12. images[j,i].Source = new BitmapImage(new Uri(@"Image/mouse.png", UriKind.Relative));
  13. images[j,i].Width = 100;
  14. images[j,i].Height = 100;
  15. images[j,i].Stretch = Stretch.Fill;
  16. images[j,i].Visibility = Visibility.Visible;
  17. CanvasWindow.Children.Add(images[j,i]);
  18. Canvas.SetLeft(images[j, i], (100 * i));
  19. Canvas.SetTop(images[j, i], (100 * j));
  20. }
  21. }
  22. }

像這樣如果有大量一樣的物件要畫,可以根據App的UI架構參考看看要用哪一種寫法比較好控制整體。
End

沒有留言:

張貼留言