Jak zmienić kolor ORAZ szerokość pasków przewijania bez nakładki w systemie Ubuntu 12.04

13

Wiem, że wiele osób skarżyło się na prawie niewidoczne i nieużywalne paski przewijania w najnowszych wersjach Ubuntu, nawet po usunięciu lub wyłączeniu domyślnych pasków przewijania nakładki. Zastanawiam się, jak mogę łatwo zmienić ich kolor ORAZ szerokość.

Mam monitor o przekątnej 13,3 cala o rozdzielczości 1600 * 900 i ledwo je widzę, jak widać na tych zdjęciach:

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

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

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

Zmieniłem już paski przewijania Firefox, LibreOffice i niektórych innych programów za pomocą programu GNOME Color Chooser:

wprowadź opis zdjęcia tutaj

Nawiasem mówiąc, używam Unity. Dzięki!

12.04  colors  scrollbar 
— Chuqui
źródło
1
Zrzut ekranu byłby miły.
— Uri Herrera
1
Zrzut ekranu jest w tym przypadku konieczny. Ponieważ udzielona odpowiedź nie jest tym, czego chciałeś.
— Anwar
Cześć @UriHerrera i Anwar, już dodałem kilka zdjęć. Dzięki!
— Chuqui,
1
Na miłość boską, dlaczego deweloperzy nie ułatwią zmiany w ustawieniach systemu?
— neuronet

Odpowiedzi:

4

Uwaga:

Formatowanie w tej odpowiedzi jest optymalne tylko dla dokładności (Ubuntu 12.04), zobacz następną odpowiedź dotyczącą ulepszonego formatowania dla zaufanego (Ubuntu 14.04).

Pokaż paski przewijania (zmień kolor)

W oparciu o informacje podane powyżej przez vasa1 zmieniłem kolor klasycznych pasków przewijania na domyślny kolor wyboru - taki sam, jakiego używają paski przewijania nakładki.

W przypadku aplikacji GTK 3 zmodyfikuj:

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

zaczynając od linii 1580, aby wyglądało to tak:

.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;
}

To powinno być domyślne.

W przypadku aplikacji GTK 2 zmodyfikuj:

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

zaczynając od linii 223, aby wyglądało to tak:

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}
    }
}

Nie wygląda w 100% identycznie z formatowaniem GTK 3, więc możesz go ulepszyć.

Ustaw klikalne paski przewijania (zwiększ szerokość)

Aby zwiększyć głupią małą szerokość, która nigdy nie była przeznaczona do użycia w produkcji, zakładam, dokonaj następujących zmian w tych samych plikach.

W przypadku aplikacji GTK 3:

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

zmodyfikuj linię 1550, aby wyglądała następująco:

.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)));
}

W przypadku aplikacji GTK 2 zmodyfikuj:

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

zmodyfikuj linię 34, aby wyglądała następująco:

GtkScrollbar::slider-width = 16

Dla tych, którzy wolą już edytowane pełne pliki, możesz pobrać mój stąd:

GTK 3: gtk-widgets.css

GTK 2: gtkrc

Bądź ostrożny. Twórz kopie zapasowe.

Cieszyć się! :)

— Nicolas
źródło
Dla tych, którzy już przeczytali moją odpowiedź: dzięki ostatniej edycji znacznie poprawiłem formatowanie. :)
— Nicolas
8

Zakładam, że masz na myśli paski przewijania nakładki, ponieważ wspominasz o Unity. Nie wiem jak zmienić szerokość, ale na pewno możesz zmienić kolor. Jeśli kolor jest wystarczająco wyraźny, uważam, że szerokość nie stanowi większego problemu, ponieważ po najechaniu myszą staje się przyzwoicie szeroki.

Musisz poszukać w folderze motywu plików o nazwie gtkrc (w folderze gtk-2.0) i gtk-widgets.css (w folderze gtk-3.0). Otwórz te pliki za pomocą edytora tekstu. Może być konieczne użycie gksudo geditzamiast tego, geditjeśli Twój motyw znajduje się w / usr / share / themes, a nie w ~ / .themes. Następnie wyszukaj paski przewijania nakładki lub pasek przewijania nakładki lub coś podobnego i baw się kolorami określonymi w tych sekcjach. Możesz nawet określić własny kolor w kodzie szesnastkowym.

Oczywiście, jeśli chcesz, możesz ustawić różne kolory w dwóch plikach.

Aby wizualizować zmiany, może być konieczne przejście do innego motywu i powrót po dokonaniu i zapisaniu zmian w tych plikach.

Zmiany, które wprowadzisz w / usr / share / themes będą dotyczyły całego systemu, a zmiany w ~ / .themes będą specyficzne dla użytkownika.

Tak wygląda mój pasek przewijania nakładki w PCManFM.

Mój pasek przewijania nakładki

Edycja : W przypadku korzystania z konwencjonalnych pasków przewijania, a następnie w celu zwiększenia kontrastu między suwakiem i koryta w aplikacjach gtk-3.0, takich jak gedit, można edytować wspomniany powyżej plik gtk-widgets.css . Aby to zrobić, wyszukaj sekcję zatytułowaną pasek przewijania (lub coś podobnego) i poszukaj linii, które mają coś takiego:

.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;

Tutaj można bawić się wartościami obrazu tła , zmieniając odcień. Wyższa wartość jest jaśniejsza, niższa wartość jest ciemniejsza.

Wolę zrobić coś prostszego: zmieniam obraz tła na kolor tła i po prostu mam kolor, który lubię. Na przykład kolor tła: czerwony; prawdopodobnie dałby wybitny kontrast.

Mój kod wygląda następująco:

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

Oczywiście zaleca się utworzenie kopii zapasowej przed edycją i można komentować rzeczy w pliku gtk-widgets.css zamiast usuwać rzeczy za pomocą /*i */.

(Nie mogę uruchomić formatowania cytatów blokowych podczas publikowania odpowiedzi. Jeśli ktoś by to posprzątał, byłbym wdzięczny).

Ostatnia edycja (mam nadzieję): użytkownicy Chrome lub Chromium mogą zwiększyć kontrast, edytując swój gtk-2.0/apps/chromium.rcplik, jeśli zapewnia go motyw, lub edytując, gtk-2.0/gtkrcjeśli jest tam wymagane. W obu przypadkach należy wyszukać styl nagłówka sekcji „chrome-gtk-frame” . Tutaj ponownie zagraj z wartością cienia w tej (lub podobnej) linii:

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

Lub można po prostu określić taki kolor:

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

lub

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

(Cytaty są wymagane.)

— Eliah Kagan
źródło
1
Przepraszam, @ vasa1! Zapomniałem wspomnieć, że usunąłem paski przewijania nakładki za pomocą „Unsettings” lub niektórych poleceń. Teraz mam wąskie paski przewijania o niskim kontraście. Właśnie to muszę naprawić. (Zredagowałem już oryginalne pytanie).
— Chuqui
@Chuqui, czy mógłbyś wymienić kilka konkretnych aplikacji, które są problematyczne? I wspomnij, którego motywu używasz. Znam co najmniej jeden motyw, który ma bardzo cienkie paski przewijania. W takim przypadku może to być kwestia wypróbowania innego motywu.
Cześć @ vasa1, chcę jeszcze raz podziękować za szczegółowe instrukcje, które mi dałeś. Przepraszam, że moje pytanie nie było wystarczająco jasne. Powyżej widać obrazy aplikacji, w których paski przewijania są słabo widoczne: Nautilus, Nuvola Player i Centrum oprogramowania Ubuntu. Wręcz przeciwnie, używając Gnome Color Chooser mogłem zmienić Firefox, Ubuntu One i paski przewijania innych programów, takich jak LibreOffice. Używam domyślnego motywu: Ambiance
— Chuqui,
1
Podana przeze mnie edycja powinna wskazać, w jaki sposób można zwiększyć kontrast nawet dla Nautilusa i USC. Nie wiem o Nuvoli. IMO, domyślna szerokość paska przewijania w Ambiance nie jest taka zła (po poprawieniu kontrastu).
Bardzo miła odpowiedź. Skąd mam wiedzieć, czy aplikacja korzysta z GTK 2 czy GTK 3. Ex nautilus, gedit używa GTK 3, ale firefox / thunderbird używa GTK 2. Czy jest jakiś sposób, aby się tego dowiedzieć?
— Chandrayya GK
2

W przypadku Ubuntu 14.04 (Trusty Tahr) potrzebne są nieco inne modyfikacje.

GTK 3: gtk-widgets.css idzie do: /usr/share/themes/Ambiance/gtk-3.0/gtk-widgets.css

GTK 2: gtkrc idzie do: /usr/share/themes/Ambiance/gtk-2.0/gtkrc

Wykonaj kopie zapasowe przed:

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/

Polecenia te spodziewa pobrane pliki gtkrc, a gtk-widgets.cssw bieżącym katalogu.

— Nicolas
źródło
1
Czy nie byłoby lepiej jako edycja innej odpowiedzi?
— Pavel V.
Zamierzałem uzyskać osobną odpowiedź, aby wyraźnie oddzielić 12.04 rzeczy od 14.04, aby konsumenci moich przygotowanych plików układu mogli szybko znaleźć odpowiednie pliki bez pomyłek. Ale ... no cóż ... można się kłócić o ...;)
— Nicolas
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.