Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image Resource Viewer #1091

Closed
avalanchus opened this issue Dec 26, 2022 · 1 comment
Closed

Image Resource Viewer #1091

avalanchus opened this issue Dec 26, 2022 · 1 comment

Comments

@avalanchus
Copy link

I made a small image collection viewer for Fluent.Ribbon.Showcase that looks something like this:

image

This would make it easier to pick up any image and fill the collection.
Can you include this in your project if you find it useful?

Fluent.Ribbon.Showcase/IconViewer.xaml

<UserControl x:Class="FluentTest.IconViewer"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:FluentTest"
             xmlns:fluentTest="clr-namespace:FluentTest"
             xmlns:fluent="urn:fluent-ribbon"
             mc:Ignorable="d" 
             d:DesignHeight="500" d:DesignWidth="300">
    <UserControl.DataContext>
        <fluentTest:DesignTimeData />
    </UserControl.DataContext>
    <Grid>
        <ListView x:Name="TvBox" ItemsSource="{Binding Data}"  HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <fluent:Button 
                        Icon ="{Binding Value}" 
                        Header="{Binding Key}"
                        SizeDefinition="Middle"/>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</UserControl>

Fluent.Ribbon.Showcase\IconViewer.xaml.cs

namespace FluentTest;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Windows;
using System.Windows.Media;

/// <summary>
///     Browse the design time collection of icons in the Resource Dictionary
/// </summary>
public partial class IconViewer
{
    public IconViewer()
    {
    }
}

public class DesignTimeData
{
    public ObservableCollection<KeyValuePair<string, DrawingImage>> Data { get; set; }

    public DesignTimeData()
    {
        ResourceDictionary dictionary = new ResourceDictionary
        {
            Source = new Uri("pack://application:,,,/Fluent;component/Themes/Images.xaml", UriKind.Absolute)
        };

        var keys = dictionary.Keys.Cast<string>().Select(key => key?.Substring(key.LastIndexOf('.') + 1)).ToArray();
        var images = dictionary.Values.Cast<DrawingImage>().ToArray();

        this.Data = new ObservableCollection<KeyValuePair<string, DrawingImage>>();

        for (var i = 0; i < dictionary.Count; i++)
        {
            this.Data.Add(new KeyValuePair<string, DrawingImage>(keys[i], images[i]));
        }
    }
}

Fluent.Ribbon\Themes\Generic.xaml - here we need to add Images.xaml for using Uri in the code above

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="pack://application:,,,/Fluent;component/Themes/Styles.xaml" />
        <ResourceDictionary Source="pack://application:,,,/Fluent;component/Themes/Images.xaml" />
        <ResourceDictionary Source="pack://application:,,,/Fluent;component/Themes/Themes/Light.Blue.xaml" />
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
@batzen batzen self-assigned this Dec 28, 2022
@batzen batzen added this to the 10.0 milestone Dec 28, 2022
@batzen batzen closed this as completed in 41c01ab Mar 21, 2023
@batzen
Copy link
Member

batzen commented Mar 21, 2023

Thanks for the idea and the starting code!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants