當沒有指定圖像時顯示替代文本

我有一個圖像控件，用戶可以在其上拖放圖片。當沒有圖像被放入並且控件爲空時，我想要顯示一個替代文本，例如「在此放置圖片」以更好地指示他/她的期望。當沒有指定圖像時顯示替代文本

我無法弄清楚如何使用觸發器與此，這表明什麼都沒有，我不能再滴在我的圖像控制圖片：

<StackPanel Grid.Column="1" Grid.Row="2" FlowDirection="LeftToRight" Orientation="Horizontal" Margin="0px 4px">   
    <StackPanel.Resources> 
     <DataTemplate x:Key="tmpTemplate"> 

      <Border BorderThickness="2" BorderBrush="#FF969DFF" CornerRadius="2" VerticalAlignment="Top"> 
      <DockPanel> 
      <Image Name="imgSelectedViewImage" Source="{Binding Image}" MinWidth="32" MinHeight="32" MaxWidth="48" MaxHeight="48" 
        HorizontalAlignment="Left" Stretch="None" 
        IsEnabled="{Binding EditMode}" Margin="2px"/> 
      <Label Content="Drag here" Name="AltText" Visibility="Collapsed"></Label> 
      </DockPanel> 
     </Border> 

     <DataTemplate.Triggers> 
      <DataTrigger Binding="{Binding Path=Image}" Value="{x:Null}"> 
      <Setter TargetName="AltText" Property="Visibility" Value="Visible" /> 
      </DataTrigger> 
     </DataTemplate.Triggers> 
    </DataTemplate> 
</StackPanel.Resources>

來源

2014-02-23 Jerome

我不能告訴你已經做了什麼來打破以前的工作拖放功能，我所能做的就是建議你撤消修改以解決該問題。但是，如果您想在集合爲空時顯示某些內容，那麼有一個簡單的方法可以做到這一點。使用集合的Count屬性是不好的，因爲當添加或刪除項目時它不會更新。

您可以在下一個int屬性只是添加到您的項目收集了這一點，但你必須確保你通知INotifyPropertyChanged接口也當收藏屬性更改：

public ObservableCollection<YourItem> YourItems 
{ 
    get { return yourItems; } 
    set 
    { 
     yourItems = value; 
     NotifyPropertyChanged("YourItems"); 
     NotifyPropertyChanged("YourItemsCount"); 
    } 
} 

public int YourItemsCount 
{ 
    get { return YourItems.Count; } 
}

然後你可以使用它在一個簡單的DataTrigger這樣的：

<Grid> 
    <!-- Put your normal content here --> 
    <TextBlock FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center" 
     Text="Drop images here"> 
     <TextBlock.Style> 
      <Style> 
       <Setter Property="TextBlock.Visibility" Value="Collapsed" /> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding YourItemsCount}" Value="0"> 
         <Setter Property="TextBlock.Visibility" Value="Visible" /> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </TextBlock.Style> 
    </TextBlock> 
</Grid>

來源

2014-02-23 01:04:51 Sheridan

非常感謝，這應該是一個有用的XAML;我現在就試一試 – Jerome

我通過設置TargetNullValue和FallbackValue靜態資源做到了。請參閱下面的代碼片段。你當然可以將它設置爲你想要的一切。

<Image Stretch="Uniform" 
     Grid.Row="0" 
     Grid.Column="1" 
     MaxHeight="250" 
     MaxWidth="250" 
     Margin="10" 
     Source="{Binding Path=Character.Portrait, TargetNullValue={StaticResource FallbackImage}, FallbackValue={StaticResource FallbackImage}}"> 
     <i:Interaction.Triggers> 
      <i:EventTrigger EventName="MouseDoubleClick"> 
       <cal:ActionMessage MethodName="ChangePicture"> 
       </cal:ActionMessage> 
      </i:EventTrigger> 
     </i:Interaction.Triggers> 
</image>

另一種方法，這可能是根據自己的喜好，因爲它使用觸發器可能是這個解決方案：Handling null when binding to an Image in XAML（看接受的答案）。不過，在我看來，設置TargetNullValue和FallbackValue是最好的選擇。

來源

2014-02-23 01:30:17 Ruhrpottpatriot

當沒有指定圖像時顯示替代文本

回答

相關問題