[feat] add mobile codec status and scrolling codec names

This commit is contained in:
dijunkun
2026-10-27 04:16:41 +08:00
parent 1687816bde
commit e123d5f2cc
20 changed files with 241 additions and 48 deletions
+32
View File
@@ -1,5 +1,37 @@
import { FlatSurface, UiSurface } from "ui_surface.slint";
import { UiRadius } from "ui_radius.slint";
// Keep codec names readable in narrow status panels without changing row height.
export component ScrollingText inherits Rectangle {
in property <string> text;
in property <color> text-color;
in property <length> font-size: 11px;
in property <int> font-weight: 400;
in property <bool> align-right: false;
private property <length> distance: max(0px, label.preferred-width - root.width);
private property <float> phase: 0;
min-width: 0px;
clip: true;
accessible-role: AccessibleRole.text;
accessible-label: root.text;
changed text => { root.phase = 0; }
changed width => { root.phase = 0; }
Timer {
interval: 16ms;
running: root.visible && root.width > 0px && root.distance > 0px;
// 30 logical pixels/second, with a one-second pause at each end.
triggered => { root.phase = mod(root.phase + 0.48, root.distance / 1px + 60); }
}
label := Text {
x: root.distance > 0px ? -min(root.distance, max(0, root.phase - 30) * 1px)
: root.align-right ? root.width - self.preferred-width : 0px;
width: self.preferred-width; height: root.height;
text: root.text; color: root.text-color;
font-size: root.font-size; font-weight: root.font-weight;
wrap: no-wrap; vertical-alignment: center;
}
}
export global FloatingBarStyle {
out property <length> corner-radius: UiRadius.menu;
}
@@ -1,7 +1,7 @@
import { SurfaceSeparator, FlatSurface, UiSurface } from "ui_surface.slint";
import { UiRadius } from "ui_radius.slint";
import { GalleryStrings } from "device_strings.slint";
import { CompactButton } from "common.slint";
import { CompactButton, ScrollingText } from "common.slint";
import { ScrollView } from "std-widgets.slint";
export struct GalleryNetworkDevice {
@@ -153,18 +153,26 @@ component NetworkRow inherits Rectangle {
spacing: 12px;
Rectangle {
width: (parent.width - 12px) / 2;
Text {
width: parent.width; height: parent.height;
text: GalleryStrings.tr("被控端编码器 ", "Remote encoder ", "Удалённый кодер ") + root.device.encoder;
font-size: 10px; color: #586f87; vertical-alignment: center; overflow: elide;
encoder-label := Text {
height: parent.height; width: self.preferred-width;
text: GalleryStrings.tr("被控端编码器 ", "Remote encoder ", "Удалённый кодер ");
font-size: 10px; color: #586f87; vertical-alignment: center;
}
ScrollingText {
x: encoder-label.width; width: max(0px, parent.width - self.x); height: parent.height;
text: root.device.encoder; font-size: 10px; text-color: #586f87;
}
}
Rectangle {
width: (parent.width - 12px) / 2;
Text {
width: parent.width; height: parent.height;
text: GalleryStrings.tr("控制端解码器 ", "Local decoder ", "Локальный декодер ") + root.device.decoder;
font-size: 10px; color: #586f87; vertical-alignment: center; overflow: elide;
decoder-label := Text {
height: parent.height; width: self.preferred-width;
text: GalleryStrings.tr("控制端解码器 ", "Local decoder ", "Локальный декодер ");
font-size: 10px; color: #586f87; vertical-alignment: center;
}
ScrollingText {
x: decoder-label.width; width: max(0px, parent.width - self.x); height: parent.height;
text: root.device.decoder; font-size: 10px; text-color: #586f87;
}
}
}
+4 -5
View File
@@ -2,7 +2,7 @@ import { SurfaceSeparator, FlatSurface, UiSurface } from "ui_surface.slint";
import { UiRadius } from "ui_radius.slint";
import { ComboBox, ScrollView } from "std-widgets.slint";
import { RemoteCursor } from "remote_cursor.slint";
import { FontAwesomeIcons, IconButton, PrimaryButton, SecondaryButton, DialogSurface, ImGuiFontStyle, ControlStyle, ButtonStyle } from "common.slint";
import { FontAwesomeIcons, IconButton, PrimaryButton, SecondaryButton, DialogSurface, ImGuiFontStyle, ControlStyle, ButtonStyle, ScrollingText } from "common.slint";
export struct StreamTab {
remote-id: string,
@@ -1458,13 +1458,12 @@ export component StreamWindow inherits Window {
color: #667085; font-size: ImGuiFontStyle.small;
vertical-alignment: center;
}
Text {
ScrollingText {
x: codec-label-width-probe.preferred-width + 8px; y: 0px;
width: parent.width - self.x; height: parent.height;
text: codec.value; color: #344054;
text: codec.value; text-color: #344054;
font-size: ImGuiFontStyle.body; font-weight: 500;
horizontal-alignment: right;
vertical-alignment: center; overflow: elide;
align-right: true;
}
}
}