Paramètres Passe à une image de liaison

Question

J'ai plusieurs éléments de menu comme celui-ci:

<navigation:RadMenuItem Header="New Assignment"> 
    <navigation:RadMenuItem.Icon> 
     <Image Source="/Images/New_Assignment.jpeg" Width="20" Height="20" /> 
    </navigation:RadMenuItem.Icon> 
</navigation:RadMenuItem> 
<navigation:RadMenuItem Header="New Course"> 
    <navigation:RadMenuItem.Icon> 
     <Image Source="/Images/New_Course.jpeg" Width="20" Height="20" /> 
    </navigation:RadMenuItem.Icon> 
</navigation:RadMenuItem> 
<navigation:RadMenuItem Header="New Folder"> 
    <navigation:RadMenuItem.Icon> 
     <Image Source="/Images/New_Folder.jpeg" Width="20" Height="20" /> 
    </navigation:RadMenuItem.Icon> 
</navigation:RadMenuItem> 

Notez que je dois mettre l'icône pour chaque élément. (Toutes les icônes sont dans le répertoire/Images/dossier) Comment puis-je passer un paramètre pour que je pourrais peut-être dire:

<navigation:RadMenuItem Header="New Assignment" Icon="{Binding ImageCollection, param1=New_Assignment.jpeg}" /> 

Où ImageCollection est la collection d'images dans le répertoire/Images/dossier.

Answer 1

Il existe une solution à votre problème.

Vous utilisez un dictionnaire de type chaîne <, ImageSource > que votre variable ImageCollection comme ceci:

public Dictionary< string, ImageSource> ImageCollection{ get; set; } 

maintenant à construire votre collection, vous devez spécifier le ImageSource correct avec un URI valide. Vous commencez avec votre adresse de base, dans votre cas "/ Images" de sorte que vous pouvez changer votre adresse de base à un point de votre code au lieu de devoir chercher toutes les occurrences d'adresse d'image ... juste pour plus de commodité.

const readonly string BASE_ADDR = "/Images"; 

Maintenant, vous pouvez commencer à construire votre collection d'images comme ceci:

ImageCollection = new Dictionary< string, ImageSource> 
{ 
    { "New_Assignment", new BitmapImage(BASE_ADDR + "/New_Assignment.jpeg") } 
    ... 
    ... 
} 

Maintenant dans votre XAML, vous êtes capable de se lier comme ceci:

<navigation:RadMenuItem 
    Header="New Assignment" 
    Icon="{Binding ImageCollection[New_Assignment]}" /> 

Cela devrait fonctionner bien . Codage heureux.

Answer 2

Je pense que la meilleure façon serait d'utiliser un ListBox databound lié à une collection d'éléments de menu Naviation:

<ListBox DataContext="{Binding MyCollectionOfNavigationItems}"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <navigation:RadMenuItem Header="{Binding Header}" Icon="{Binding ImagePath, Converter={StaticResource PathToImageConverter}}" 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 

et liant à une collection d'éléments qui pourraient être structuré quelque chose comme ceci:

public class NavigationItem { 
    public string Header { get; set; } 
    public string ImagePath { get; set; } 
} 

et en utilisant un convertisseur personnalisé pour convertir le chemin de l'image en une image (vous pourriez également avoir une propriété d'image que vous créez dans le code).

Si ce n'est pas une option, vous pouvez probablement le faire en utilisant une MultiBinding et une propriété jointe, mais si vous écrivez toujours la syntaxe MultiBinding pour chaque élément, ce serait encore plus bavard.