How to use ux:Property to a <SolidColor />

I’m trying to set the background colour of a panel by using a property of the class: OptionsBackground.

<Rectangle Layer="Background">
    <SolidColor ux:Binding="OptionsBackground" ux:Name="bgCol" />
    <Stroke Brush="#BFD8DD" Width="1"/>

My property is <Brush ux:Property="OptionsBackground"/> However when building the project I get this error:

'Fuse.Controls.Rectangle does not expose a bindable property called 'OptionsBackground' -

Hi Casey,

The code you pasted doesn’t make much sense. Can you show more code? Specifically the code that declares OptionsBackground

Hi Anders,

Yeah sorry, I’ve just realised the actual file is a bit of a mess haha. I’ll just post the file.

<Panel ux:Class="DropdownMenu" ux:Name="menu">
    <object ux:Property="ListItems" />
    <Brush ux:Property="OptionsBackground" />
        var Observable = require("FuseJS/Observable");

        var selected = Observable();

        function selectMe(arg){
            selected.value =;


        module.exports = {
            selected: selected,
            selectMe: selectMe,



    <Panel ux:Class="DropdownOption" ux:Name="self" Height="30">
        <string ux:Property="Text" />
        <Rectangle Layer="Background">
            <SolidColor ux:Binding="OptionsBackground" ux:Name="bgCol" />
            <Stroke Brush="#BFD8DD" Width="1"/>
        <Text Alignment="CenterLeft" Value="{Property self.Text}" FontSize="14" Margin="10,0"/>

            <Change bgCol.Color="#D9E1E4" />
    <Panel ux:Class="DropdownSelectedItem" ux:Name="self" Height="40">
        <string ux:Property="Text" />
        <Text Alignment="CenterLeft" Value="{Property self.Text}" FontSize="16" Margin="10,0"/>
        <Panel Layer="Background">
            <Rectangle Fill="#FBFDFD" Height="100%" Alignment="Top"/>

    <Panel Width="200" Height="40">
            <Stroke Brush="#BFD8DD" Width="1"/>
        <DropdownSelectedItem Text="{selected}" />
            <Toggle Target="expandDropdown" />

        <WhileTrue ux:Name="expandDropdown">
            <StackPanel Offset="0,40">
                <Each Items="{Property menu.ListItems}">
                    <DropdownOption Text="{name}" Clicked="{selectMe}" />

It’s pretty all over the place, especially as I have multiple classes within one :confused:


In this case where you want to access properties from the outer class, you have to declare your inner class ux:InnerClass.

<Panel ux:InnerClass="DropdownOption" ux:Name="self" Height="30">

Next, your syntax for binding the property is wrong. This is how:

<Rectangle Layer="Background" Fill="{Property menu.OptionsBackground}">