Image Property in ux:Class

How-to Discussions
1

I’m trying to implement a sidebar menu that contains navigation links. I’ve made a MenuItem class here

<Panel ux:Class="MenuItem" Clicked="{NavigateToPage}">

    <string ux:Property="ItemText" />
    <string ux:Property="Icon" />

    <Image File="{Property Icon}" Width="35" Height="35" Alignment="CenterLeft" Margin="15, 0, 20, 0" Opacity="0.6">
        <DropShadow /> 
    </Image>

    <Text Value="{Property this.ItemText}">
        <DropShadow Spread="0.1" />
    </Text> 

</Panel>

I need some way to pass which image I want to use for the icon so what do you suggest? I know passing the file name won’t work -obviously-, but I attached this snippet of code to give you an idea of what I’m trying to accomplish. I know there’s a type called Resource but I haven’t had much luck trying to implement it.

2

Change <string ux:Property="Icon" /> with <FileSource ux:Property="Icon" />

and you forgot the this in File="{Property Icon}" so it should be: File="{Property this.Icon}"

3

Edwin Reynoso wrote:

Change <string ux:Property="Icon" /> with <FileSource ux:Property="Icon" />

and you forgot the this in File="{Property Icon}" so it should be: File="{Property this.Icon}"

Thank you!! I’m loving the concept of Classes, but the documentation on them isn’t that descriptive. Do you know of any other video tutorials or books? Other than Jake’s Videos

4

Nope but there’s the Reference page: https://www.fusetools.com/learn/reference

Click Image scroll to the File property and next to it is FileSource and that’s how you know which property is needed