Eto Styling

Rhino Developer
1

Hi everyone,

As suggested in wiki page of eto, I want to use styling of Eto in my plugin for example as below,

Eto.Style.Add<Label>("arial, pt:8", label => 
{ 
    label.Font = new Font("Arial", 8); 
});

Eto.Style.Add<Label>("arial, pt:12", label => 
{ 
    label.Font = new Font("Arial", 12); 
});

Let’s say I have a top object MyPluginContentPanel which contains UI components and layout. While initializing, should I put this methodin constructor? like;

public MyPluginContentPanel()
{
    Eto.Style.Add<Label>("arial, pt:8", label => 
    { 
        label.Font = new Font("Arial", 8); 
    });
    InitializeComponents();
    InitializeLayout();
}

When I implement styling like this, it is not working.

public void InitializeComponenets()
{
    var testLabel = new Label() { Text = "test", Style = "arial, pt:8" }
}

Do you think am I using Eto.Style.Add<Control> method in wrong place?

Thanks in advance,
-Oğuzhan

2

@curtisw - is this something you can help with?

3

Hi @oguzhankoral,

It looks like you’re running into issues because of the spaces in your style ID’s. Spaces delimit the style ID so you can apply more than one style to a control. So this should work if you remove the spaces.

Another thing to note is that adding that in the constructor will add the style each time it is instantiated. Typically if you want to create a global style you’d add it to the static constructor. Otherwise, you can use cascading styles.

For example, this would be how I’d do it:

static MyPluginContentPanel()
{
    // Add a global style that we only define one time
    Eto.Style.Add<Label>("my_arial_pt8", label => 
    { 
        label.Font = new Font("Arial", 8); 
    });
}
public MyPluginContentPanel()
{
    var testLabel = new Label() { Text = "test", Style = "my_arial_pt8" }
}

To use cascading styles, you’d do something like this:

public MyPluginContentPanel()
{
    // Add the style to the panel's Styles property
    this.Styles.Add<Label>("my_arial_pt8", label => label.Font = new Font("Arial", 8));

    // the above style will be applied when this label is added as a child to this panel
    var testLabel = new Label() { Text = "test", Style = "my_arial_pt8" }
}

Hope this helps!

1 Like
4

@curtisw, So appreciated! Your suggestion solved my issue. Speaking of which styling, I want to ask styling of forum posts. How can you type this example codes with red colored for method names and bold in preformatted text. Are you guys using any HTML converter?

Sorry for extra question but I want to make better styled question to forum :slight_smile:

-Oğuzhan

5

@oguzhankoral,

To do this, put the type of language after the three back-ticks.

E.g. for c-sharp put ```c#

For xml, you can do ```xml

See this post for details of the supported languages/formats.

Cheers!

1 Like
6 
public double HappinessLevel { get; set; }
public bool ThanksToCurtis()
{
    if(HappinessLevel > 8)
        return true;
    else
        return false;
}

Thanks @curtisw ! :slight_smile:

2 Likes