Come cambiare il colore E la larghezza delle barre di scorrimento non sovrapposte in Ubuntu 12.04

13

So che molte persone si sono lamentate delle barre di scorrimento quasi invisibili e non utilizzabili nelle ultime versioni di Ubuntu, anche dopo aver rimosso o disabilitato le barre di scorrimento di sovrapposizione predefinite. Mi chiedo come posso facilmente cambiare il loro colore E larghezza.

Ho un monitor da 13,3 pollici con una risoluzione di 1600 * 900 e riesco a malapena a vederli, come puoi vedere in queste immagini:

http://placerdigital.net/up/Dropbox_003.png

http://placerdigital.net/up/Nuvola.png

http://placerdigital.net/up/Ubuntu%20Software%20Center_004.png

Ho già cambiato Firefox, LibreOffice e alcune barre di scorrimento di altri software usando GNOME Color Chooser:

inserisci qui la descrizione dell'immagine

A proposito, sto usando Unity. Grazie!

12.04  colors  scrollbar 
— Chuqui
fonte
1
Lo screenshot sarebbe carino.
— Uri Herrera,
1
Uno screenshot è un must, penso in questo caso. Dal momento che la risposta fornita non è quella che volevi.
— Anwar,
Ciao @UriHerrera e Anwar, ho già aggiunto alcune immagini. Grazie!
— Chuqui,
1
Per favore, per amore di Dio, perché gli sviluppatori non possono semplicemente cambiare le impostazioni di sistema?
— neuronet,

Risposte:

4

Nota:

Le formattazioni in questa risposta sono ottimali solo per precise (Ubuntu 12.04), vedi la risposta successiva per formattazioni migliorate per fidati (Ubuntu 14.04).

Rendi visibili le barre di scorrimento (cambia colore)

Sulla base delle informazioni di vasa1 fornite sopra, ho cambiato il colore delle barre di scorrimento classiche con il colore di selezione predefinito, lo stesso usato anche dalle barre di scorrimento sovrapposte.

Per le applicazioni GTK 3 modificare:

gksu gedit /usr/share/themes/Ambiance/gtk-3.0/gtk-widgets.css

a partire dalla linea 1580 in modo che assomigli a:

.scrollbar.slider,
.scrollbar.slider:hover,
.scrollbar.button,
.scrollbar.slider.vertical,
.scrollbar.button.vertical {
    background-image: -gtk-gradient (linear, left top, right top,
                                     from (shade (@selected_bg_color, 1.38)),
                                     to (shade (@selected_bg_color, 1.22)));
    border-style: solid;
    border-width: 1px;

    -unico-border-gradient: -gtk-gradient (linear, left top, right top,
                                           from (shade (@selected_bg_color, 1.14)),
                                           to (shade (@selected_bg_color, 1.14)));
    -unico-centroid-texture:  url("assets/scrollbar_handle_vertical.png");
    -unico-inner-stroke-gradient: -gtk-gradient (linear, left top, right top,
                                                 from (shade (@selected_bg_color, 1.46)),
                                                 to (shade (@selected_bg_color, 1.3)));
    -unico-inner-stroke-width: 1px;
}

.scrollbar.slider.vertical:hover {
    background-image: -gtk-gradient (linear, left top, right top,
                                     from (shade (@selected_bg_color, 1.28)),
                                     to (shade (@selected_bg_color, 1.02)));
    border-style: solid;
    border-width: 1px;

    -unico-border-gradient: -gtk-gradient (linear, left top, right top,
                                           from (shade (@selected_bg_color, 0.94)),
                                           to (shade (@selected_bg_color, 0.94)));
    -unico-centroid-texture:  url("assets/scrollbar_handle_vertical.png");
    -unico-inner-stroke-gradient: -gtk-gradient (linear, left top, right top,
                                                 from (shade (@selected_bg_color, 1.36)),
                                                 to (shade (@selected_bg_color, 1.1)));
    -unico-inner-stroke-width: 1px;
}

.scrollbar.slider.horizontal,
.scrollbar.button.horizontal {                                   
    background-image: -gtk-gradient (linear, left top, left bottom,
                                     from (shade (@selected_bg_color, 1.38)),
                                     to (shade (@selected_bg_color, 1.22)));

    -unico-border-gradient: -gtk-gradient (linear, left top, left bottom,
                                           from (shade (@selected_bg_color, 1.14)),
                                           to (shade (@selected_bg_color, 1.14)));
    -unico-centroid-texture:  url("assets/scrollbar_handle.png");
    -unico-inner-stroke-gradient: -gtk-gradient (linear, left top, left bottom,
                                                 from (shade (@selected_bg_color, 1.46)),
                                                 to (shade (@selected_bg_color, 1.3)));
}

.scrollbar.slider.horizontal:hover {
    background-image: -gtk-gradient (linear, left top, left bottom,
                                     from (shade (@selected_bg_color, 1.28)),
                                     to (shade (@selected_bg_color, 1.02)));

    -unico-border-gradient: -gtk-gradient (linear, left top, left bottom,
                                           from (shade (@selected_bg_color, 0.94)),
                                           to (shade (@selected_bg_color, 0.94)));
    -unico-centroid-texture:  url("assets/scrollbar_handle.png");
    -unico-inner-stroke-gradient: -gtk-gradient (linear, left top, left bottom,
                                                 from (shade (@selected_bg_color, 1.36)),
                                                 to (shade (@selected_bg_color, 1.1)));
}


.scrollbar.button,
.scrollbar.button:insensitive {
    -unico-outer-stroke-width: 0;
}

Questo dovrebbe essere predefinito.

Per le applicazioni GTK 2 modificare:

gksu gedit /usr/share/themes/Ambiance/gtk-2.0/gtkrc

a partire dalla linea 223 in modo che assomigli a:

style "scrollbar" = "button" {
    xthickness = 2
    ythickness = 2

    bg[NORMAL] = shade(1.3, @selected_bg_color)
    bg[PRELIGHT] = shade (1.04, @selected_bg_color)

    bg[ACTIVE] = shade (0.96, @selected_bg_color)

    engine "murrine"
    {
        border_shades = {1.15, 1.1}
        roundness = 20
        contrast = 1.0
        trough_shades = {0.92, 0.98}
        lightborder_shade = 1.3
        glowstyle = 5
        glow_shade = 1.02
        gradient_shades = {1.2, 1.0, 1.0, 0.86}
        trough_border_shades = {0.9, 0.98}
    }
}

Non sembra identico al 100% alla formattazione GTK 3, quindi sentiti libero di migliorarlo.

Rendi cliccabili le barre di scorrimento (aumenta la larghezza)

Per aumentare la piccola sciocca larghezza che non è mai stata pensata per essere utilizzata in produzione, suppongo che apporti le seguenti modifiche agli stessi file.

Per applicazioni GTK 3:

gksu gedit /usr/share/themes/Ambiance/gtk-3.0/gtk-widgets.css

modifica la riga 1550 in modo che assomigli a:

.scrollbar {
    -GtkScrollbar-has-backward-stepper: 0;
    -GtkScrollbar-has-forward-stepper: 0;
    -GtkRange-slider-width: 16;

    border-radius: 20px;

    -unico-border-gradient: -gtk-gradient (linear, left top, left bottom,
                                           from (shade (@bg_color, 0.74)),
                                           to (shade (@bg_color, 0.74)));
}

Per le applicazioni GTK 2 modificare:

gksu gedit /usr/share/themes/Ambiance/gtk-2.0/gtkrc

modifica la riga 34 in modo che assomigli a:

GtkScrollbar::slider-width = 16

Per coloro che preferiscono i file completi già modificati, è possibile scaricare il mio da qui:

GTK 3: gtk-widgets.css

GTK 2: gtkrc

Stai attento. Effettua backup.

Godere! :)

— Nicolas
fonte
Per quelli che hanno già letto la mia risposta: con l'ultima modifica ho migliorato ampiamente la formattazione. :)
— Nicolas,
8

Suppongo che ti riferisci alle barre di scorrimento sovrapposte perché menzioni Unity. Non so come modificare la larghezza, ma puoi sicuramente cambiare il colore. Se il colore è abbastanza distinto, ritengo che la larghezza non sia un grosso problema perché al passaggio del mouse diventa abbastanza ampia.

Devi cercare nella cartella del tuo tema i file chiamati gtkrc (nella cartella gtk-2.0) e gtk-widgets.css (nella cartella gtk-3.0). Apri questi file con un editor di testo. Potrebbe essere necessario utilizzare gksudo geditinvece che solo geditse il tema è in / usr / share / themes e non in ~ / .themes. Quindi, cerca barre di scorrimento sovrapposte o barra di scorrimento sovrapposte o qualcosa di simile e gioca con i colori specificati in quelle sezioni. Puoi anche specificare il tuo colore in codice esadecimale.

Ovviamente, puoi scegliere colori diversi nei due file se lo desideri.

Per visualizzare le modifiche potrebbe essere necessario passare a un altro tema e viceversa dopo aver apportato e salvato le modifiche in questi file.

Le modifiche apportate in / usr / share / themes saranno a livello di sistema e le modifiche a ~ / .themes saranno specifiche dell'utente.

Ecco come appare la mia barra di scorrimento overlay in PCManFM.

La barra di scorrimento della mia sovrapposizione

Modifica : nel caso in cui si stiano usando le barre di scorrimento convenzionali, quindi per aumentare il contrasto tra il dispositivo di scorrimento e il trogolo nelle app gtk-3.0 come gedit, è possibile modificare il file gtk-widgets.css sopra menzionato. Per fare ciò, cerca la sezione intitolata barra di scorrimento (o qualcosa di simile) e cerca le linee che hanno qualcosa del genere:

.scrollbar.slider,
.scrollbar.slider:hover,
.scrollbar.button,
.scrollbar.slider.vertical,
.scrollbar.slider.vertical:hover,
.scrollbar.button.vertical {
    background-image: -gtk-gradient (linear, left top, right top,
                                 from (shade (@bg_color, 1.08)),
                                 to (shade (@bg_color, 0.92)));
    border-style: solid;
    border-width: 1px;

Qui, si può giocare con i valori dell'immagine di sfondo cambiando l'ombra. Un valore più alto è più luminoso, un valore più basso è più scuro.

Preferisco fare qualcosa di più semplice: cambio l'immagine di sfondo in colore di sfondo e ho solo un colore che mi piace. Quindi, ad esempio, background-color: red; darebbe probabilmente un contrasto eccezionale.

Il mio codice è simile al seguente:

.scrollbar.slider,
.scrollbar.button,
.scrollbar.slider.vertical,
.scrollbar.button.vertical {
    background-color: #003263; /*@theme_bg_color;*/
    /**/
    /**/

Ovviamente, è consigliabile un backup prima della modifica e si può commentare cose nel file gtk-widgets.css invece di eliminare cose usando /*e */.

(Non riesco a far funzionare la formattazione delle virgolette durante la pubblicazione delle risposte. Se qualcuno pulisse le cose, sarei grato.)

Un'ultima modifica (spero): gli utenti di Chrome o Chromium possono aumentare il contrasto modificando il loro gtk-2.0/apps/chromium.rcfile se il loro tema lo fornisce o modificando gtk-2.0/gtkrcse ciò che è richiesto è presente lì. In entrambi i casi si dovrebbe cercare una sezione intitolata "chrome-gtk-frame" . Qui di nuovo, gioca con il valore dell'ombra in questa (o simile) linea:

ChromeGtkFrame::scrollbar-slider-normal-color = shade (1.4, @panel_bg)

Oppure si può semplicemente specificare un colore come questo:

ChromeGtkFrame::scrollbar-slider-normal-color = "#003263"

o

ChromeGtkFrame::scrollbar-slider-normal-color = "blue"

(Le virgolette sono obbligatorie.)

— Eliah Kagan
fonte
1
Mi dispiace, @ vasa1! Ho dimenticato di dire che ho rimosso le barre di scorrimento overlay usando "Unsettings" o alcuni comandi. Ora ho barre di scorrimento strette e a basso contrasto. Questo è quello che devo correggere. (Ho già modificato la domanda originale).
— Chuqui,
@Chuqui, potresti menzionare alcune app specifiche che sono problematiche? E menziona quale tema stai usando. Conosco almeno un tema con barre di scorrimento molto sottili. In tal caso, potrebbe trattarsi solo di provare un altro tema.
Ciao @ vasa1, voglio ringraziarti di nuovo per le istruzioni dettagliate che mi hai dato. Mi dispiace di non essere stato abbastanza chiaro nella mia domanda. Sopra puoi vedere le immagini delle applicazioni in cui le barre di scorrimento sono difficili da vedere: Nautilus, Nuvola Player e Ubuntu Software Center. Al contrario, usando Gnome Color Chooser potrei cambiare Firefox, Ubuntu One e le altre barre di scorrimento del software, come LibreOffice. Sto usando il tema predefinito: Ambiance
— Chuqui,
1
La modifica che ho fornito dovrebbe indicarti come aumentare il contrasto anche per Nautilus e USC. Non so di Nuvola. IMO, la larghezza della barra di scorrimento predefinita in Ambiance non è troppo male (una volta modificato il contrasto).
Risposta molto bella. Come posso sapere se un'applicazione utilizza GTK 2 o GTK 3? Ex nautilus, gedit utilizza GTK 3 ma firefox / thunderbird usa GTK 2. Esiste un modo per scoprirlo?
— Chandrayya GK,
2

Per Ubuntu 14.04 (Trusty Tahr) sono necessarie modifiche leggermente diverse.

GTK 3: gtk-widgets.css va a: /usr/share/themes/Ambiance/gtk-3.0/gtk-widgets.css

GTK 2: gtkrc va a: /usr/share/themes/Ambiance/gtk-2.0/gtkrc

Effettuare backup prima:

sudo cp /usr/share/themes/Ambiance/gtk-2.0/gtkrc /usr/share/themes/Ambiance/gtk-2.0/gtkrc.bak
sudo cp gtkrc /usr/share/themes/Ambiance/gtk-2.0/
sudo cp /usr/share/themes/Ambiance/gtk-3.0/gtk-widgets.css /usr/share/themes/Ambiance/gtk-3.0/gtk-widgets.css.bak
sudo cp gtk-widgets.css /usr/share/themes/Ambiance/gtk-3.0/

Tali comandi prevedono i file scaricati gtkrce gtk-widgets.cssnella directory corrente.

— Nicolas
fonte
1
Non sarebbe meglio come una modifica per l'altra tua risposta?
— Pavel V.
La mia intenzione di una risposta separata era quella di separare chiaramente le cose 12.04 dalla 14.04 in modo che i consumatori dei miei file di layout preparati potessero trovare quelli giusti rapidamente e senza essere confusi. Ma ... beh ... si può discutere di ...;)
— Nicolas,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.