Select to view content in your preferred language

DAML use Images sourced from an images.xaml file

137
8
2 weeks ago
JonathanDewalt
Regular Contributor

I have many custom vector based images that I use for my buttons, menu etc on all my Add-In dockpane and forms.  I reference them as static resources and this works wonderfully.  What I want to do and can't seem to figure out how or if it is even possible, use those same images in the config.daml file  for both the smallImage and largeImage button and tool properties.  This pack statement works for Esri images: pack:application:,,,/ArcGIS.Desktop.Resources;component/Images/GenerateSectorLines16.  I would like to do the same but be referencing my own Images.xaml resource file.  The same one my dockpane buttons use but after trying every possible solution I can come up with, nothing has worked. I'm no reaching out to you.  Any suggestions? 

Thanks,

Jon  

Tags (1)
0 Kudos
8 Replies
GKmieliauskas
Esri Regular Contributor

Hi,

You can set xaml for smallImage, largeImage, overlaySmallImage and overlayLargeImage:

        <button id="DockpaneSimple_Button1" caption="Button 1" className="Button1" loadOnClick="true" 
				smallImage="Images/ImageSmall.xaml" 
				largeImage="Images/ImageLarge.xaml">
          <tooltip heading="Tooltip Heading">Tooltip text<disabledText /></tooltip>

Build action for project items  ImageSmall.xaml and ImageLarge.xaml must be 'Content'.

My sample xaml:

<DrawingImage xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
    <DrawingImage.Drawing>
        <DrawingGroup>
            <GeometryDrawing Brush="#00FFFFFF"
                                 Geometry="M 0,0L 32,0L 32,32L 0,32L 0,0 Z " />
            <GeometryDrawing Brush="#FFFF0000"
                                 Geometry="F1 M 6.25,3.97918L 23.125,3.97918L 23.125,16.1458L 6.25,16.1458L 6.25,3.97918 Z ">
                <GeometryDrawing.Pen>
                    <Pen LineJoin="Round"
                             Brush="#FF000000" />
                </GeometryDrawing.Pen>
            </GeometryDrawing>
            <GeometryDrawing Brush="#FF00C800"
                                 Geometry="F1 M 21.8542,11.0625C 26.399,11.0625 30.0833,14.7468 30.0833,19.2917C 30.0833,23.8365 26.399,27.5208 21.8542,27.5208C 17.3093,27.5208 13.625,23.8365 13.625,19.2917C 13.625,14.7468 17.3093,11.0625 21.8542,11.0625 Z ">
                <GeometryDrawing.Pen>
                    <Pen LineJoin="Round"
                             Brush="#FF000000" />
                </GeometryDrawing.Pen>
            </GeometryDrawing>
            <GeometryDrawing Brush="#FFFFFF00"
                                 Geometry="F1 M 16.8731,14.9035L 11.9668,16.2498L 8.58953,12.5761L 8.25831,17.6042L 3.62852,19.7405L 8.33013,21.5017L 8.84603,26.4958L 12.083,22.5562L 17.0316,23.5064L 14.3306,19.3103L 16.8731,14.9035 Z ">
                <GeometryDrawing.Pen>
                    <Pen LineJoin="Round"
                             Brush="#FF000000" />
                </GeometryDrawing.Pen>
            </GeometryDrawing>
        </DrawingGroup>
    </DrawingImage.Drawing>
</DrawingImage>

Resulting view :

GKmieliauskas_0-1733771774924.png

For local resources you don't need prefix "pack:application:,,,/".

0 Kudos
JonathanDewalt
Regular Contributor
Hello,
Yes, I can get it to work if I have individual xaml files for each image but what I want to do is to use and image collection. I have an image.xmal file that contains many pictures and I would like to reference the images within.
Such as:
largeImage="Images/Light.xaml#Grid_Right32.xaml"
I have no problem accessing the images as static resources from wpf forms and dockpanes, just can't figure out if it is possible to access from the config.daml.
Thanks,

0 Kudos
GKmieliauskas
Esri Regular Contributor

You can make your own library of images and then you can access them from daml as Esri images

0 Kudos
JonathanDewalt
Regular Contributor
I have an image library and have no problem accessing the images from wpf but I can't figure out how to access them from the daml file. I attached a sample file with six images:
LayerManager_32
Linked
MergeFireLine
PolygonToFireLine
PourPoint32
WaterPriority32

0 Kudos
UmaHarano
Esri Regular Contributor

Hi @JonathanDewalt 

I don't see the attached sample xaml with the 6 images.  Can you please attach it again?

Thanks!

0 Kudos
JonathanDewalt
Regular Contributor

you will need to change the extension from .txt back to .xaml

0 Kudos
SumitMishra_016
Regular Contributor
  1.             Add the image file to the Images folder.
  2.             Update the DAML file:

               Replace the <Image> tag as follows:

<Image>Images\height.png</Image>

               Modify the image references to:

smallImage="Images\height.png"

largeImage="Images\height.png"

  1.             Open the .prj file and include the following tag within the <ItemGroup> section:

<Content Include="Images\height.png" />

  1.             In the .csproj file, set the Build Action of the image to Resource.
0 Kudos
JonathanDewalt
Regular Contributor
All my images in my Images.xaml library file are xaml images. I'm not using any png's. I have a library each for light and dark themes. I have these files in a separate dll project that contains all my add-in code snippets and custom controls. I have no problem referencing these images from wpf to use on forms and dockpanes. Just can't get it to work in the config.daml file. Best way to demonstrate is to let you give it a try.
Create a test add-in.
Install the nuget package "rmg.Common". This is my package and I reference it in all my add-ins.
In your Add-In module constructor add:
public Module1()
{
var x = new rmg.Common.InitiateThemes();
}
Add a dockpane or pro window to your project and add the rmg.common reference to the resourcDictionary:





And an image to your form and set source to StaticResource. (DynamicResource seems to work as well)


You can also add a button and set it to one of the styles. Some of the styles have images some don't.

What I want to do is reference these same images on my Add-In ribbon bar. That is where I am stuck.
Here are the names of some of the images within the library.
CreateIsland.xaml
CopyToFireLine.xaml
DeleteAdornmentUpperLeft.xaml
HotCold32.xaml
MergeFireLine.xaml
PolygonToFireLine.xaml
SplitFireLine.xaml

So... if you have any suggestions, that would be great.
Thanks for your time.
Jon




0 Kudos