☰

Debian 10のGTK 2と3アプリケーションでレガシースクロールバーを取得するには？

tag-icon • tag-icon gtk theme
Debian 10のGTK 2と3アプリケーションでレガシースクロールバーを取得するには？

私はDebian 10でXFce4を使用しています。

GTK 2アプリケーションを開くと、スクロールバーが正常に表示され、上部と下部に大きなスクロールバーと矢印が表示されます。

GTK 3アプリケーションを開くと、スクロールバーが薄くてクリックして見にくく、どこにも矢印がなく、時には完全に消えることもあります。

AdwaitaやBreezeなどのテーマを選択すると、GTK 2アプリケーションはGTK 3アプリケーションと一致しますが、使用と表示が難しいスクロールバーがあります。

GTK 2およびGTK 3アプリケーションに、より伝統的なスクロールバーとより大きなボタンを提供する方法はありますか？

答え1

GTK+2

GTK+2のスクロールバーには問題はありません。たぶんあなたはそれらを「妥協」する方法で進行するテーマを使用しているかもしれません。たとえば、私が使用している別のテーマに切り替えてみてくださいGreenMotif。

もっと愚かなことを避けるために、xcursor-themesDebianパッケージをインストールして次のように実行してください。sudo update-alternatives --set x-cursor-theme /etc/X11/cursors/core.theme

Qt5

これも簡単そうです。 GTKエンジンやテーマを使用していないことを確認してください。私は個人的にqt5-style-plugin-motifDebianパッケージをインストールして使用しています。

kcminputrc_mouse_cursortheme=core他の場所でこれを設定する必要があるかもしれません~/.config/startupconfig。 GUI設定ダイアログは、core「テーマ」をオプションとして表示しない傾向があります。別のカーソルテーマを選択してから、ポイントファイルから発生した項目を検索してすべて変更できます（私がやったことです）。

GTK+3

これをデザインするのは無限のPITAです。私は持っていますGTK+3を耐え難いものにする方法を文書化しました。スクロールを修正して、Debian Stretchでデフォルトで使用されているXfce4 "Basic"テーマと非常によく似たテーマを使用して、以下の回答のほとんどをインライン化します。同様のWindows®95の代替案、追加の背景情報などが含まれています。 ☺

~/.config/gtk-3.0/gtk2xfce4basic.css

次のコンテンツでこのファイルを作成します（または上記のリンクから元のファイルをダウンロードしてください）。

/*
 * to install, copy to ~/.config/gtk-3.0/gtk2xfce4basic.css
 * and append the line…
 *
 *  @import 'gtk2xfce4basic.css';
 *
 * to ~/.config/gtk-3.0/gtk.css
 */

/* somewhat unfuck GTK+3, by mirabilos, Ⓕ CC0 — theme Xfce basic */

/*-
 * append to ~/.xsessionrc or so, ~/.pam_environment or ~/.profile maybe
 *
 * GTK_OVERLAY_SCROLLING=0; export GTK_OVERLAY_SCROLLING
 *
 * merge into ~/.config/gtk-3.0/settings.ini
 *
 * [Settings]
 * gtk-xft-rgba=none
 * gtk-cursor-theme-name=core
 * gtk-enable-animations=0
 * gtk-primary-button-warps-slider=false
 *
 * Firefox about:config set: pref("widget.non-native-theme.enabled", false);
 * and consider a userContent.css to disable website-styled scroll“bar”s (see
 * https://edugit.org/-/snippets/31 for how).
 *
 * Try: GTK_DEBUG=interactive gtk3-demo
 */

/* remove dotted lines from GTK+3 applications */
.undershoot.top, .undershoot.right, .undershoot.bottom, .undershoot.left {
    background-image:none;
}
undershoot.top, undershoot.right, undershoot.bottom, undershoot.left {
    background-image:none;
}

/* force scrollbar arrows */
.scrollbar, scrollbar {
    -GtkScrollbar-has-backward-stepper:true !important;
    -GtkScrollbar-has-forward-stepper:true !important;
}

/* GTK+2-style scrollbar with Xfce basic theme colours {{{ */

scrollbar.horizontal, scrollbar.horizontal content,
scrollbar.horizontal button.up, scrollbar.horizontal button.up:disabled,
scrollbar.horizontal trough, scrollbar.horizontal slider,
scrollbar.horizontal button.down, scrollbar.horizontal button.down:disabled,
scrollbar.vertical, scrollbar.vertical content,
scrollbar.vertical button.up, scrollbar.vertical button.up:disabled,
scrollbar.vertical trough, scrollbar.vertical slider,
scrollbar.vertical button.down, scrollbar.vertical button.down:disabled {
    margin:0px;
    outline:0px;
    -gtk-outline-radius:0;
    border-radius:0px;
    border:0px;
    box-shadow:none;
    padding:0px;
    background-color:inherit;
}

scrollbar.horizontal button.up, scrollbar.horizontal button.up:disabled,
scrollbar.horizontal button.down, scrollbar.horizontal button.down:disabled,
scrollbar.vertical button.up, scrollbar.vertical button.up:disabled,
scrollbar.vertical button.down, scrollbar.vertical button.down:disabled {
    -gtk-icon-source:none;
}

scrollbar.horizontal {
    min-height:14px;
    box-shadow:
        inset 1px 1px 0 0 #8C8982,
        inset -1px -1px 0 0 #FBFBFA;
    padding:1px;
    background-color:#C4C2BD;
}

scrollbar.horizontal contents {
    min-height:14px;
}

scrollbar.horizontal button.up {
    min-width:11px;
    background:
        linear-gradient(to top right,    transparent 49.5%, #000000 50%) 5px 6px / 3px 3px,
        linear-gradient(to bottom right, transparent 49.5%, #000000 50%) 5px 4px / 3px 3px,
        linear-gradient(to top right,    transparent 49.5%, #434341 50%) 4px 6px / 4px 4px,
        linear-gradient(to bottom right, transparent 49.5%, #434341 50%) 4px 3px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.horizontal button.up:disabled {
    min-width:11px;
    background:
        linear-gradient(to top right,    transparent 49.5%, #757575 50%) 5px 6px / 3px 3px,
        linear-gradient(to bottom right, transparent 49.5%, #757575 50%) 5px 4px / 3px 3px,
        linear-gradient(to top right,    transparent 49.5%, #9D9D9D 50%) 4px 6px / 4px 4px,
        linear-gradient(to bottom right, transparent 49.5%, #959493 50%) 4px 3px / 4px 4px,
        linear-gradient(to top right,    transparent 49.5%, #FFFFFF 50%) 6px 7px / 3px 3px,
        linear-gradient(to bottom right, transparent 49.5%, #FFFFFF 50%) 6px 5px / 3px 3px,
        linear-gradient(to top right,    transparent 49.5%, #F0EFED 50%) 5px 7px / 4px 4px,
        linear-gradient(to bottom right, transparent 49.5%, #F0EFED 50%) 5px 4px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.horizontal trough {
    min-height:14px;
}

scrollbar.horizontal slider {
    min-width:18px;
}

scrollbar.horizontal button.down {
    min-width:11px;
    background:
        linear-gradient(to bottom left, transparent 49.5%, #000000 50%) 5px 4px / 3px 3px,
        linear-gradient(to top left,    transparent 49.5%, #000000 50%) 5px 6px / 3px 3px,
        linear-gradient(to bottom left, transparent 49.5%, #434341 50%) 5px 3px / 4px 4px,
        linear-gradient(to top left,    transparent 49.5%, #434341 50%) 5px 6px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.horizontal button.down:disabled {
    min-width:11px;
    background:
        linear-gradient(to bottom left, transparent 49.5%, #757575 50%) 5px 4px / 3px 3px,
        linear-gradient(to top left,    transparent 49.5%, #757575 50%) 5px 6px / 3px 3px,
        linear-gradient(to bottom left, transparent 49.5%, #959493 50%) 5px 3px / 4px 4px,
        linear-gradient(to top left,    transparent 49.5%, #9D9D9D 50%) 5px 6px / 4px 4px,
        linear-gradient(to bottom left, transparent 49.5%, #FFFFFF 50%) 6px 5px / 3px 3px,
        linear-gradient(to top left,    transparent 49.5%, #FFFFFF 50%) 6px 7px / 3px 3px,
        linear-gradient(to bottom left, transparent 49.5%, #F0EFED 50%) 6px 4px / 4px 4px,
        linear-gradient(to top left,    transparent 49.5%, #F0EFED 50%) 6px 7px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.horizontal button.up, scrollbar.horizontal button.up:disabled,
scrollbar.horizontal slider,
scrollbar.horizontal button.down, scrollbar.horizontal button.down:disabled {
    min-height:11px;
    box-shadow:
        inset -2px -2px 0 0 #9E9A91,
        inset 1px 1px 0 0 #FFFFFF,
        inset -1px -1px 0 0 #000000;
    /*      ↑   →   ↓   ←   */
    padding:1px 2px 2px 1px;
    background-color:#DCDAD5;
}

scrollbar.vertical {
    min-width:14px;
    box-shadow:
        inset 1px 1px 0 0 #8C8982,
        inset -1px -1px 0 0 #FBFBFA;
    padding:1px;
    background-color:#C4C2BD;
}

scrollbar.vertical contents {
    min-width:14px;
}

scrollbar.vertical button.up {
    min-height:11px;
    background:
        linear-gradient(to bottom right, transparent 49.5%, #000000 50%) 4px 5px / 3px 3px,
        linear-gradient(to bottom left,  transparent 49.5%, #000000 50%) 6px 5px / 3px 3px,
        linear-gradient(to bottom right, transparent 49.5%, #434341 50%) 3px 4px / 4px 4px,
        linear-gradient(to bottom left,  transparent 49.5%, #434341 50%) 6px 4px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.vertical button.up:disabled {
    min-height:11px;
    background:
        linear-gradient(to bottom right, transparent 49.5%, #757575 50%) 4px 5px / 3px 3px,
        linear-gradient(to bottom left,  transparent 49.5%, #757575 50%) 6px 5px / 3px 3px,
        linear-gradient(to bottom right, transparent 49.5%, #959493 50%) 3px 4px / 4px 4px,
        linear-gradient(to bottom left,  transparent 49.5%, #9D9D9D 50%) 6px 4px / 4px 4px,
        linear-gradient(to bottom right, transparent 49.5%, #FFFFFF 50%) 5px 6px / 3px 3px,
        linear-gradient(to bottom left,  transparent 49.5%, #FFFFFF 50%) 7px 6px / 3px 3px,
        linear-gradient(to bottom right, transparent 49.5%, #F0EFED 50%) 4px 5px / 4px 4px,
        linear-gradient(to bottom left,  transparent 49.5%, #F0EFED 50%) 7px 5px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.vertical trough {
    min-width:14px;
}

scrollbar.vertical slider {
    min-height:18px;
}

scrollbar.vertical button.down {
    min-height:11px;
    background:
        linear-gradient(to top left,  transparent 49.5%, #000000 50%) 6px 5px / 3px 3px,
        linear-gradient(to top right, transparent 49.5%, #000000 50%) 4px 5px / 3px 3px,
        linear-gradient(to top left,  transparent 49.5%, #434341 50%) 6px 5px / 4px 4px,
        linear-gradient(to top right, transparent 49.5%, #434341 50%) 3px 5px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.vertical button.down:disabled {
    min-height:11px;
    background:
        linear-gradient(to top left,  transparent 49.5%, #757575 50%) 6px 5px / 3px 3px,
        linear-gradient(to top right, transparent 49.5%, #757575 50%) 4px 5px / 3px 3px,
        linear-gradient(to top left,  transparent 49.5%, #9D9D9D 50%) 6px 5px / 4px 4px,
        linear-gradient(to top right, transparent 49.5%, #959493 50%) 3px 5px / 4px 4px,
        linear-gradient(to top left,  transparent 49.5%, #FFFFFF 50%) 7px 6px / 3px 3px,
        linear-gradient(to top right, transparent 49.5%, #FFFFFF 50%) 5px 6px / 3px 3px,
        linear-gradient(to top left,  transparent 49.5%, #F0EFED 50%) 7px 6px / 4px 4px,
        linear-gradient(to top right, transparent 49.5%, #F0EFED 50%) 4px 6px / 4px 4px;
    background-repeat:no-repeat;
}

scrollbar.vertical button.up, scrollbar.vertical button.up:disabled,
scrollbar.vertical slider,
scrollbar.vertical button.down, scrollbar.vertical button.down:disabled {
    min-width:11px;
    box-shadow:
        inset -2px -2px 0 0 #9E9A91,
        inset 1px 1px 0 0 #FFFFFF,
        inset -1px -1px 0 0 #000000;
    /*      ↑   →   ↓   ←   */
    padding:1px 2px 2px 1px;
    background-color:#DCDAD5;
}

/* }}} end of GTK+2-style scrollbar */

~/.config/gtk-3.0/gtk.css

次の行を追加します。

@import 'gtk2xfce4basic.css';

~/.config/gtk-3.0/settings.ini

[Settings]このセクションに次の（またはその他の適切な）設定を追加します。

gtk-xft-rgba=none     
gtk-cursor-theme-name=core   
gtk-enable-animations=0   
gtk-primary-button-warps-slider=false

環境

GTK_OVERLAY_SCROLLING=0X11セッションに対してこれを設定したことを確認してください。 （これは通常、~/.pam_environmentオペレーティングシステム、システムの初期化方法、およびX11起動方法に応じて、次のように入力することによって実行できます。~/.profile~/.xinitrc~/.xsessionrc~/.xsessionrc通常Debianとその派生物で最も単純なものです。 )

GTK_OVERLAY_SCROLLING=0
export GTK_OVERLAY_SCROLLING

Firefoxブラウザ

最新バージョンはGTK + 3を使用し、独自のスクロールバーを描画する必要があると主張しています。したがって、上記の修正だけでは十分ではありません。 Firefoxに追加の設定を追加する必要があります。閉鎖しかし、小さなもの一つ一つが役に立ちます…

about:config

pref("widget.non-native-theme.enabled", false);

userContent.css

ファイルに次の行を入力しますuserContent.css。

* {
    scrollbar-color:unset !important;
    scrollbar-width:unset !important;
}

これがなければ文書（完全または動作中） ただし、以下が必要です。活性化最初。これにより、Twitter、StackExchangeなどで使用できるスクロールバーが提供されます。 ☻

関連情報