Using gtk-rs, how do I highlight the entire single line edit?

In this line of code:

    let entry = Entry::new();
    entry.set_placeholder_text(Some(&format!("{}", label)));

this will show this:

However using nemo or even thunar file managers when selected it shows like this:

image

Not too sure how do I get like some sort of a background color highlight like this when the field is selected?

I never used gtk-rs but as far as I know properties can be modified by CSS at least it's possible in gtk in C.

This may help: CSS - GUI development with Rust and GTK 4

I see so I would somehow get css to highlight the background? I don't have to specify a particular color as since thunar and nemo both use the same color when it gets highlighted, it appears that it is the arc theme that is setting the color so in my case I would just use css to basically highlight the background color?

If there is another way, I don't know. I'm no expert sorry.

1 Like

The correct way to do it is to use CSS, yes. If using Adwaita you automatically get a lot of standard colors, defined as CSS variables. For plain GTK I suggest to inspect an existing application and choose the color you like better, adjusting it so that it shows correctly in your UI.

For a "selected" entry you will need the :focus-within pseudo-class, because what really gets focused is the GtkText inside the GtkEntry. Something like:

entry:focus-within {
    background: rgba(53, 132, 228, 1);
}

You can have a look at the example entry-background-highlight here that I just wrote. It shows how to load a custom stylesheet (from a string) that changes the background color when the text inside it is focused.

1 Like

Hi mate thanks for your assistance.

So I have actually installed arc theme and currently my application does follow the theme, however just the background highlighting thing (like in nemo):

image

does not occur, I do understand I need to use CSS.

In your example it looks like you are forcing a particular background color to be present, however in my case I want my entry to use the background color preset by the arc theme I am not too sure how to do this?

As I said it depends on your theme. Foe example Adwaita defines all colors as CSS variables and you cwn do:

entry:focus-within {
    background: var(--color-accent-bg);
}

Unfortunately I don't know anything about arc so I can't suggest the correct way to get the correct color.

Edit: I just had a look at arc source code for Gtk3 and it seems that all color values are hard-coded. :confused:

I want to do something like this

Single line edit, go and use the main color of the theme I am using and highlight the background color

So this would work with any theme, for example arc would make this blue, another theme would make this red?

I just needed this for css:

        b"
        entry:focus
        {
            background-color: @theme_selected_bg_color;
        }
        ").unwrap();