동적으로 이미지를 추가해야합니다.

Question

내 실버 라이트 애플리케이션에 다른 이미지를 동적으로 추가하고 싶습니다. 나는 아래 xmal 여기

<Image Margin="0,4,5,8" Source="logo.png" Stretch="Fill" HorizontalAlignment="Right" Width="96"/> 

이미지를 전환 할 수 있어야합니다.

현재 나는 다음 자습서를 사용하고

<Grid x:Name="ControlPanelGrid" Margin="8,-26,8,13" Grid.Row="1" Grid.RowSpan="4" Opacity="0"> 
<Rectangle x:Name="ControlPanel" Margin="2,3,3,5" Stroke="#FF474747" RadiusY="4" RadiusX="4" Opacity="0.9" StrokeThickness="0.5"> 
    <Rectangle.Effect> 
    <DropShadowEffect Opacity="0.26" BlurRadius="7" Direction="319"/> 
    </Rectangle.Effect> 
    <Rectangle.Fill> 
    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
     <GradientStop Color="#FF191919" Offset="0.936"/> 
     <GradientStop Color="#FF454545" Offset="0.187"/> 
     <GradientStop Color="#FF191919"/> 
    </LinearGradientBrush> 
    </Rectangle.Fill> 
</Rectangle> 
<Grid x:Name="timelinecontrols" Grid.ColumnSpan="1" Margin="0,0,165,13" d:LayoutOverrides="GridBox" d:IsHidden="True"> 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition/> 
    <ColumnDefinition Width="Auto"/> 
    <ColumnDefinition Width="Auto"/> 
    </Grid.ColumnDefinitions> 
    <smf:Timeline x:Name="TimelineElement" Cursor="Hand" Chapters="{TemplateBinding Chapters}" EndPosition="{TemplateBinding EndPosition}" Foreground="{x:Null}" HorizontalContentAlignment="Stretch" IsLive="{TemplateBinding IsMediaLive}" LivePosition="{TemplateBinding LivePosition}" Margin="80,0,170,-10" StartPosition="{TemplateBinding StartPosition}" TimelineMarkers="{TemplateBinding TimelineMarkers}" VerticalAlignment="Center" Style="{StaticResource TimelineStyle1}" /> 
    <Border x:Name="TimeContainer" BorderThickness="1" Grid.Column="1" HorizontalAlignment="Left" Margin="0" Opacity="0"> 
    <Grid Height="28" MaxHeight="28" MinWidth="60" MinHeight="28" UseLayoutRounding="True"> 
     <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="0.25*"/> 
      <ColumnDefinition Width="0.367*"/> 
      <ColumnDefinition Width="0.383*"/> 
     </Grid.ColumnDefinitions> 
     <TextBlock x:Name="CurrentPositionElement" Foreground="#FFC1C1C1" FontSize="9" HorizontalAlignment="Left" Padding="8,0,0,0" TextAlignment="Center" Text="{Binding PlaybackPosition, Converter={StaticResource TimeSpanValueConverter}, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Center"/> 
     <TextBlock x:Name="TimeSeparatorElement" Grid.Column="1" Foreground="#FFFDFAFA" FontSize="9" HorizontalAlignment="Center" Margin="3,0" Opacity="0.4" Text="|" VerticalAlignment="Center"/> 
     <TextBlock x:Name="CurrentDurationElement" Grid.Column="2" Foreground="#FFFDFDFD" FontSize="9" HorizontalAlignment="Left" Opacity="0.4" Padding="0,0,8,0" Text="{Binding EndPosition, Converter={StaticResource TimeSpanValueConverter}, RelativeSource={RelativeSource TemplatedParent}}" VerticalAlignment="Center"/> 
     </Grid> 
    </Grid> 
    </Border> 
</Grid> 
<Image x:Name="btnVloume" Margin="0,-1,383,5" Source="volume.png" Stretch="Fill" Height="49" d:LayoutOverrides="Width, GridBox" Width="53" HorizontalAlignment="Right" d:IsHidden="True"/> 
<smf:VolumeControl x:Name="VolumeElement" VolumeLevel=".5" RenderTransformOrigin="0.5,0.5" Margin="0,-46.5,326.074,-50.5" UseLayoutRounding="False" d:LayoutRounding="Auto" HorizontalAlignment="Right" Width="36" Style="{StaticResource VolumeControlStyle1}" d:IsHidden="True" > 
    <smf:VolumeControl.RenderTransform> 
    <CompositeTransform Rotation="90.02"/> 
    </smf:VolumeControl.RenderTransform> 
</smf:VolumeControl> 
<ToggleButton x:Name="FullScreenToggleElement" BorderThickness="0" Cursor="Hand" HorizontalAlignment="Right" HorizontalContentAlignment="Stretch" Height="28" Margin="0,14,153,11" Padding="0" Style="{StaticResource FullScreenElementStyle}" VerticalContentAlignment="Stretch" Width="29" d:LayoutOverrides="HorizontalAlignment" Opacity="0"/> 
<Image x:Name="_3D" HorizontalAlignment="Right" Margin="0,1,180,3" Source="3D.png" Stretch="Fill" Width="53" Height="49" Cursor="Hand" Opacity="0.8" MouseLeftButtonUp="_3D_MouseLeftButtonUp"> 
    <i:Interaction.Triggers> 
    <i:EventTrigger EventName="MouseEnter"> 
     <ei:ChangePropertyAction x:Name="_3d_100_Opacity" PropertyName="Opacity" Value="1"/> 
    </i:EventTrigger> 
    <i:EventTrigger EventName="MouseLeave"> 
     <ei:ChangePropertyAction x:Name="_3d_80_Opacity" PropertyName="Opacity" Value="0.8"/> 
    </i:EventTrigger> 
    </i:Interaction.Triggers> 
</Image> 
<Image x:Name="analytics" HorizontalAlignment="Left" Margin="980,3,0,-1" Source="analytics.png" Stretch="Fill" Width="53" Cursor="Hand" Opacity="0.7"> 
    <i:Interaction.Triggers> 
    <i:EventTrigger EventName="MouseEnter"> 
     <ei:ChangePropertyAction x:Name="analytics_MouseEnter" PropertyName="Opacity" Value="1"/> 
    </i:EventTrigger> 
    <i:EventTrigger EventName="MouseLeave"> 
     <ei:ChangePropertyAction x:Name="analytics_MouseLeave" PropertyName="Opacity" Value="0.7"/> 
    </i:EventTrigger> 
    </i:Interaction.Triggers> 
</Image> 
<Image x:Name="btn_fullscreen" HorizontalAlignment="Right" Margin="0,0,140,4" Source="full_screen.png" Stretch="Fill" Width="53" Height="49" Opacity="0.8" Cursor="Hand"> 
    <i:Interaction.Triggers> 
    <i:EventTrigger EventName="MouseEnter"> 
     <ei:ChangePropertyAction x:Name="btn_fullscreen_mouseOver" PropertyName="Opacity" Value="1"/> 
    </i:EventTrigger> 
    <i:EventTrigger EventName="MouseLeave"> 
     <ei:ChangePropertyAction x:Name="btn_fullscreen_mouseOut" PropertyName="Opacity" Value="0.8"/> 
    </i:EventTrigger> 
    </i:Interaction.Triggers> 
</Image> 
<smf:PlayElement x:Name="PlayElement" Content="PlayElement" PlayState="{TemplateBinding PlayState}" HorizontalAlignment="Left" Height="51" Margin="9,2,0,0" Style="{StaticResource PlayElementStyle1}" Width="53" Cursor="Hand" /> 
<Image Margin="0,4,5,8" Source="logo.png" Stretch="Fill" HorizontalAlignment="Right" Width="96"/> 
</Grid> 

다음과 같은 XML을 가지고있다. http://blogs.silverlight.net/blogs/msnow/archive/2008/06/06/dynamically-loading-and-display-images-in-beta-2.aspx는하지만 그래서 그것을 작동 얻기 위해 추가 할 수 있습니다 여기

<Image Margin="0,4,5,8" Source="logo.png" Stretch="Fill" HorizontalAlignment="Right" Width="96"/> 

이미지 소스의 이름을 변경하는 방법을 잘 모르겠습니다. 전체 아이디어는 내가 이미지를 전환 할 때마다 로고 .png이 될 것이고 때로는 웃기도하고 때로는 뭔가 다른 것일 수도 있습니다.

감사

Answer 1

이 시도 :

XAML :

<Window x:Class="FlipImages.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="525" Name="mainWindow"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="Auto" /> 
     </Grid.RowDefinitions> 
     <Slider Grid.Row="0" Width="Auto" Value="{Binding Index, Mode=TwoWay}" Minimum="0" Maximum="{Binding ImagePaths.Count}" TickFrequency="1" /> 
     <TextBlock Grid.Row="1" Text="{Binding CurrentPath}" /> 
     <Image Grid.Row="2" Margin="5" Source="{Binding ImageSource}" Stretch="None" HorizontalAlignment="Left" /> 
    </Grid> 
</Window> 

코드 숨김 :

당신은 당신의 요구에 맞게 this.ImagePaths = Directory.EnumerateFiles(@"C:\temp\imgs\", "*.*", SearchOption.TopDirectoryOnly).ToList();을 변경해야

// ----------------------------------------------------------------------- 
// <copyright file="MainWindow.xaml.cs" company="-.-"> 
// TODO: Update copyright text. 
// </copyright> 
// ----------------------------------------------------------------------- 
namespace FlipImages 
{ 
    using System; 
    using System.Collections.Generic; 
    using System.ComponentModel; 
    using System.IO; 
    using System.Linq; 
    using System.Windows; 
    using System.Windows.Media; 
    using System.Windows.Media.Imaging; 
    using Image = System.Windows.Controls.Image; 

    /// <summary> 
    /// Interaction logic for MainWindow.xaml 
    /// </summary> 
    public partial class MainWindow : Window, INotifyPropertyChanged 
    { 
     /// <summary> 
     /// backing <see cref="Index"/> 
     /// </summary> 
     private int index = 0; 

     /// <summary> 
     /// Initializes a new instance of the MainWindow class. 
     /// </summary> 
     public MainWindow() 
     { 
      InitializeComponent(); 

      this.ImagePaths = Directory.EnumerateFiles(@"C:\temp\imgs\", "*.*", SearchOption.TopDirectoryOnly).ToList(); 

      this.mainWindow.DataContext = this; 
     } 

     /// <summary> 
     /// used to notify ui about changes 
     /// </summary> 
     public event PropertyChangedEventHandler PropertyChanged;  

     /// <summary> 
     /// Gets or sets paths to available images 
     /// </summary> 
     public List<string> ImagePaths { get; set; } 

     /// <summary> 
     /// Gets path of current image 
     /// </summary> 
     public string CurrentPath 
     { 
      get 
      { 
       return this.ImagePaths[this.Index]; 
      } 
     } 

     /// <summary> 
     /// Gets or sets value currently selected with slider 
     /// </summary> 
     public int Index 
     { 
      get 
      { 
       return this.index; 
      } 

      set 
      { 
       this.index = value; 
       this.OnPropertyChanged("Index"); 
       this.OnPropertyChanged("CurrentPath"); 
       this.OnPropertyChanged("ImageSource"); 
      } 
     } 

     /// <summary> 
     /// Gets imagesource 
     /// </summary> 
     public ImageSource ImageSource 
     { 
      get 
      { 
       BitmapImage bi = new BitmapImage(); 
       bi.BeginInit(); 
       bi.UriSource = new Uri(this.ImagePaths[this.Index]); 
       bi.DecodePixelWidth = 200; 
       bi.EndInit(); 

       return bi; 
      } 
     } 

     /// <summary> 
     /// Raise PropertyChangedEvent 
     /// </summary> 
     /// <param name="propertyName">Name of property changed</param> 
     protected virtual void OnPropertyChanged(string propertyName) 
     { 
      PropertyChangedEventHandler tmp = this.PropertyChanged; 

      if (null != tmp) 
      { 
       tmp(this, new PropertyChangedEventArgs(propertyName)); 
      } 
     } 
    } 
} 

.

Answer 2

당신은 ImageSource 개체를 반환 데이터 컨텍스트에 대한 몇 가지 속성에 이미지의 Source 속성을 결합해야한다. 예를 들어

<Image Source="{Binding ImageSrc}"/> 

public ImageSource ImageSrc { 
    get { 
    if (something) { 
     return new BitmapImage(new Uri("logo.png")); 
    } 
    else { 
     return new BitmapImage(new Uri("laugh.png")); 
    } 
    } 
} 

참고 : 데이터 컨텍스트 객체가 INotifyPropertyChanged (이에 대한 기사를 많이)를 구현하고, 당신이 그것을 다시 평가해야 할 때마다 ImageSrc 속성에 대한 PropertyChanged 이벤트를 마련 할 필요가있다.