Wpf - отображать изображение без использования файла XAML

Question

Я пытаюсь получить изображение для отображения с использованием Wpf. Я не могу жестко закодировать изображение в файле XAML, я должен реализовать его только в файлах .cs. (Динамически отображены изображения)

Вот что я получил до сих пор:

ImageSource imageSource = new BitmapImage(new Uri(@"C:/Users/Pierrick/Desktop/tileset/1.png")); 
System.Windows.Controls.Image image1 = new System.Windows.Controls.Image(); 
image1.Source = imageSource; 

код работает нормально, но ничего не отображается. Не удивительно, я не указал местоположение изображения в окне, но я не знаю, как это сделать.

Заранее благодарим за любую помощь!

Answer 1

Вам нужно будет добавить элемент управления Image на панель макета в вашем приложении. Предположим, у вас есть MainWindow XAML как это:

<Window ...> 
    <Grid x:Name="rootGrid"> 
    </Grid> 
</Window> 

Вы можете добавить изображение в коллекцию детской Энергосистемы по

rootGrid.Children.Add(image1); 

---

Если вы собираетесь динамически размещать несколько изображений конкретных вы обычно используете элемент ItemsControl с соответствующей моделью просмотра, которая использует Canvas как свою ItemsPanel и устанавливает местоположение каждого элемента изображения, привязывая свойства Canvas.Left и Canvas.Top в свой ItemContainerStyle. Он будет использовать элемент управления Image в ItemTemplate:

<ItemsControl ItemsSource="{Binding ImageItems}"> 
    <ItemsControl.ItemsPanel> 
     <ItemsPanelTemplate> 
      <Canvas/> 
     </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.ItemContainerStyle> 
     <Style TargetType="ContentPresenter"> 
      <Setter Property="Canvas.Left" Value="{Binding X}"/> 
      <Setter Property="Canvas.Top" Value="{Binding Y}"/> 
     </Style> 
    </ItemsControl.ItemContainerStyle> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <Image Width="{Binding Width}" 
        Height="{Binding Height}" 
        Source="{Binding Image}"/> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

Модель вида будет выглядеть следующим образом:

public class ImageItem 
{ 
    public double X { get; set; } 
    public double Y { get; set; } 
    public double Width { get; set; } 
    public double Height { get; set; } 
    public ImageSource Image { get; set; } 
} 

public class ViewModel 
{ 
    public ObservableCollection<ImageItem> ImageItems { get; set; } 
} 

Как вы можете видеть ItemsSource свойства ItemsControl связанно с ImageItems собственности посмотреть модель. Связывание элементов переходит к свойствам класса элемента данных ImageItem, то есть к типу элемента коллекции.

Теперь вы создадите экземпляр модели представления, например. в конструкторе вашего MainWindow и назначить его в DataContext:

public MainWindow() 
{ 
    InitializeComponent(); 

    var vm = new ViewModel 
    { 
     ImageItems = new ObservableCollection<ImageItem>() 
    }; 

    vm.ImageItems.Add(new ImageItem 
     { 
      X = 100, 
      Y = 100, 
      Width = 100, 
      Height = 100, 
      Image = new BitmapImage(new Uri(...)) 
     }); 

    DataContext = vm; 
} 

Answer 2

Это на самом деле зависит от компоновки вашего контейнера, например, если вы хотите добавить изображение к сетке, скажем, что ваше окно выглядит следующим образом:

<Grid x:Name="Grid1"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="*"/>    
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 

</Grid> 

, чтобы добавить изображение в Grid1 программно здесь как:

  ImageSource imageSource = new BitmapImage(new Uri("yep.png",UriKind.Relative)); 
     System.Windows.Controls.Image image1 = new System.Windows.Controls.Image(); 
     image1.Source = imageSource; 
     Grid.SetColumn(image1, 0);//image1 is added to column 0 
     Grid.SetRow(image1, 0);//row 0 

     Grid1.Children.Add(image1);