自从弃用 Gnome 后，一直都在使用 labwc 这个窗口管理器，加上一些其它桌面核心组件，算是自己打造了一个桌面环境。好处是什么都可以自己控制，坏处是什么都必须自己打造。这个过程有点类似抖音上面自己手搓汽车的视频，算是自得其乐，同时能加深理解什么是桌面环境。
老实说，如今 Linux 打造自己的桌面环境，比 10 年前好很多了，也没什么难度，个人觉得比直接使用 Gnome、KDE、Xfce 等要有意思。
如何为 labwc 核心的桌面环境，我写过系列文章，有兴趣的读者可以前往查看。
本文为登出界面的一个补充，也很简单直接，因为中文世界信息还不多，简单记录方便后来者。
所谓登出界面(logout menu)，就是你退出桌面环境时，弹出的一个选择菜单，进入不同功能模式，比如关机、锁屏、登出等。
默认的 labwc 配置是没有给出这样的菜单选择，当你不小心点到 exit 时，直接就退出系统回到登录界面了，可以说非常暴力。
所以，经过一段时间的使用后，个人觉得必须给装上本文的主角 wlogout
直接包管理安装，这种东西功能更新不频繁。
1sudo apt install wlogout
安装好后，命令即就绪。
1➜ ~ which wlogout
2/usr/bin/wlogout
3➜ ~ wlogout -v
41.1.1
要测试效果，可以直接运行 wlogut 命令，弹出的界面如下所示。
为了真正使用 wlogout，得把它嵌入到 labwc 的 menu 中。
相比默认配置的变动如下：
简单解释就是用 wlogout 命令接管 退出 和 关机 命令，当你在系统的右键菜单中选择 Exit 或者 Poweroff 时，即弹出 wlogout 的菜单。
这样的好处是，误点的时候不会立即退出桌面环境，毕竟多了一层选择，出错的概率下降一个挡位。
请看相关配置
1➜ ~ tree .config/wlogout/
2.config/wlogout/
3├── icons
4│ ├── hibernate.svg
5│ ├── lock.svg
6│ ├── logout.svg
7│ ├── reboot.svg
8│ ├── shutdown.svg
9│ └── suspend.svg
10├── layout
11└── style.css
12
132 directories, 8 files
14➜ ~ cat .config/wlogout/layout
15{
16 "label" : "lock",
17 "action" : "swaylock",
18 "text" : "Lock",
19 "keybind" : "l"
20}
21{
22 "label" : "hibernate",
23 "action" : "systemctl hibernate",
24 "text" : "Hibernate",
25 "keybind" : "h"
26}
27{
28 "label" : "logout",
29 "action" : "loginctl terminate-user $USER",
30 "text" : "Logout",
31 "keybind" : "e"
32}
33{
34 "label" : "shutdown",
35 "action" : "systemctl poweroff",
36 "text" : "Shutdown",
37 "keybind" : "s"
38}
39{
40 "label" : "suspend",
41 "action" : "systemctl suspend",
42 "text" : "Suspend",
43 "keybind" : "u"
44}
45{
46 "label" : "reboot",
47 "action" : "systemctl reboot",
48 "text" : "Reboot",
49 "keybind" : "r"
50}
51➜ ~ cat .config/wlogout/style.css
52* {
53 background-image: none;
54}
55window {
56 background-color: rgba(0, 0, 0, 0.4);
57}
58button {
59 color: #ffffff;
60 background-color: #1e222a;
61 border-style: solid;
62 border-color: #33ccfe;
63 border-width: 2px;
64 border-radius: 3%;
65 background-repeat: no-repeat;
66 background-position: center;
67 background-size: 25%;
68 margin: 50px;
69}
70
71button:focus,
72button:active {
73 background-color: #06b6d4;
74 outline-style: none;
75}
76
77button:hover {
78 background-color: #353c4a;
79}
80
81#lock {
82 background-image: image(
83 url("./icons/lock.svg"),
84 url("/usr/share/wlogout/icons/lock.png"),
85 url("/usr/local/share/wlogout/icons/lock.png")
86 );
87}
88
89#logout {
90 background-image: image(
91 url("./icons/logout.svg"),
92 url("/usr/share/wlogout/icons/logout.png"),
93 url("/usr/local/share/wlogout/icons/logout.png")
94 );
95}
96
97#suspend {
98 background-image: image(
99 url("./icons/suspend.svg"),
100 url("/usr/share/wlogout/icons/suspend.png"),
101 url("/usr/local/share/wlogout/icons/suspend.png")
102 );
103}
104
105#hibernate {
106 background-image: image(
107 url("./icons/hibernate.svg"),
108 url("/usr/share/wlogout/icons/hibernate.png"),
109 url("/usr/local/share/wlogout/icons/hibernate.png")
110 );
111}
112
113#shutdown {
114 background-image: image(
115 url("./icons/shutdown.svg"),
116 url("/usr/share/wlogout/icons/shutdown.png"),
117 url("/usr/local/share/wlogout/icons/shutdown.png")
118 );
119}
120
121#reboot {
122 background-image: image(
123 url("./icons/reboot.svg"),
124 url("/usr/share/wlogout/icons/reboot.png"),
125 url("/usr/local/share/wlogout/icons/reboot.png")
126 );
127}
上述配置文件都相当直白，分别控制图标、功能块相关、各种样式，基本上想怎么调整都可以。
通常这种定制漂亮界面的活，我都是去 github 搜索 xx theme 关键字解决，万一对方是个设计师呢？
写这个文章时，搜索 wlogout theme 只返回 2 个结果，第二个不错： https://github.com/DreamMaoMao/wlogout-theme
按照对方的配置，替换后效果如下：
我机器上面操作后真实效果不好，text 文章位置不对，懒得截图，估计要调整 style.css 文件，css 高手可以尽情发挥。
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。