Spinbox missed to add font-family and font-bold property.

docs/astro/src/content/docs/reference/std-widgets/basic-widgets/spinbox.mdx

@@ -83,6 +83,16 @@ The size that is used on increment or decrement of `value`.
 The horizontal alignment of the text.
 </SlintProperty>
 
+### font-family
+<SlintProperty propName="font-family" typeName="string">
+The font family of the input text
+</SlintProperty>
+
+### font-italic
+<SlintProperty propName="font-italic" typeName="bool" defaultValue="false">
+The italic state of the font of the input text
+</SlintProperty>
+
 ## Callbacks
 
 ### edited(int)

internal/backends/qt/qt_widgets/spinbox.rs

@@ -32,6 +32,8 @@ pub struct NativeSpinBox {
     pub maximum: Property<i32>,
     pub step_size: Property<i32>,
     pub horizontal_alignment: Property<TextHorizontalAlignment>,
+    pub font_family: Property<SharedString>,
+    pub font_italic: Property<bool>,
     pub cached_rendering_data: CachedRenderingData,
     pub edited: Callback<IntArg>,
     data: Property<NativeSpinBoxData>,
@@ -63,6 +65,14 @@ if (pressed) {
 option.stepEnabled = QAbstractSpinBox::StepDownEnabled | QAbstractSpinBox::StepUpEnabled;
 option.frame = true;
 }
+
+QFont spinBoxFont(const QWidget *widget, const QString &family, bool italic) {
+QFont font = widget->font();
+if (!family.isEmpty())
+    font.setFamily(family);
+font.setItalic(italic);
+return font;
+}
 }}
 
 impl Item for NativeSpinBox {
@@ -89,6 +99,8 @@ impl Item for NativeSpinBox {
         let pressed = data.pressed;
         let enabled = self.enabled();
         let read_only = self.read_only();
+        let font_family: qttypes::QString = self.font_family().as_str().into();
+        let font_italic = self.font_italic();
         let widget: NonNull<()> = SlintTypeErasedWidgetPtr::qwidget_ptr(&self.widget_ptr);
 
         let size = cpp!(unsafe [
@@ -97,12 +109,15 @@ impl Item for NativeSpinBox {
             pressed as "bool",
             enabled as "bool",
             read_only as "bool",
+            font_family as "QString",
+            font_italic as "bool",
             widget as "QWidget*"
         ] -> qttypes::QSize as "QSize" {
             ensure_initialized();
             auto style = qApp->style();
 
             QStyleOptionSpinBox option;
+            option.fontMetrics = QFontMetrics(spinBoxFont(widget, font_family, font_italic));
             initQSpinBoxOptions(option, pressed, enabled, read_only, active_controls);
 
             QStyleOptionFrame frame;
@@ -327,6 +342,8 @@ impl Item for NativeSpinBox {
         let active_controls = data.active_controls;
         let pressed = data.pressed;
         let read_only = this.read_only();
+        let font_family: qttypes::QString = this.font_family().as_str().into();
+        let font_italic = this.font_italic();
 
         let horizontal_alignment = match this.horizontal_alignment() {
             TextHorizontalAlignment::Left => key_generated::Qt_AlignmentFlag_AlignLeft,
@@ -347,10 +364,14 @@ impl Item for NativeSpinBox {
             pressed as "bool",
             dpr as "float",
             initial_state as "int",
-            horizontal_alignment as "int"
+            horizontal_alignment as "int",
+            font_family as "QString",
+            font_italic as "bool"
         ] {
             auto style = qApp->style();
+            QFont font = spinBoxFont(widget, font_family, font_italic);
             QStyleOptionSpinBox option;
+            option.fontMetrics = QFontMetrics(font);
             option.styleObject = widget;
             option.state |= QStyle::State(initial_state);
             if (enabled && has_focus) {
@@ -372,6 +393,7 @@ impl Item for NativeSpinBox {
             QRect text_rect = qApp->style()->subElementRect(QStyle::SE_LineEditContents, &frame, widget);
             text_rect.adjust(1, 2, 1, 2);
             (*painter)->setPen(option.palette.color(QPalette::Text));
+            (*painter)->setFont(font);
             (*painter)->drawText(text_rect, QString::number(value), QTextOption(static_cast<Qt::AlignmentFlag>(horizontal_alignment)));
         });
     }

internal/compiler/builtin_elements.rs

@@ -3748,6 +3748,8 @@ fn build(l: &mut Loader) {
         in property <int> step-size: 1;
         in property <TextHorizontalAlignment> horizontal-alignment;
         in property <bool> read-only;
+        in property <string> font-family;
+        in property <bool> font-italic;
         callback edited(value: int);
     } }
 

internal/compiler/widgets/common/spinbox-base.slint

@@ -8,6 +8,8 @@ export component SpinBoxBase {
     in property <brush> color <=> text-input.color;
     in property <length> font-size <=> text-input.font-size;
     in property <int> font-weight <=> text-input.font-weight;
+    in property <string> font-family <=> text-input.font-family;
+    in property <bool> font-italic <=> text-input.font-italic;
     in property <color> selection-background-color <=> text-input.selection-background-color;
     in property <color> selection-foreground-color <=> text-input.selection-foreground-color;
     in property <TextHorizontalAlignment> horizontal-alignment <=> text-input.horizontal-alignment;
@@ -31,15 +33,15 @@ export component SpinBoxBase {
 
     public function increment() {
         if !root.read-only {
-           root.update-value(root.value + root.step-size);
-           root.update-text-and-cursor();
+            root.update-value(root.value + root.step-size);
+            root.update-text-and-cursor();
         }
     }
 
     public function decrement() {
         if !root.read-only {
-           root.update-value(root.value - root.step-size);
-           root.update-text-and-cursor();
+            root.update-value(root.value - root.step-size);
+            root.update-text-and-cursor();
         }
     }
 

internal/compiler/widgets/cosmic/spinbox.slint

@@ -41,6 +41,8 @@ export component SpinBox {
     in property <bool> enabled <=> base.enabled;
     in property <bool> read-only <=> base.read-only;
     in property <int> step-size <=> base.step-size;
+    in property <string> font-family <=> base.font-family;
+    in property <bool> font-italic <=> base.font-italic;
     in property <TextHorizontalAlignment> horizontal-alignment <=> base.horizontal-alignment;
     out property <bool> has-focus <=> base.has-focus;
     in-out property <int> value <=> base.value;

internal/compiler/widgets/cupertino/spinbox.slint

@@ -66,6 +66,8 @@ export component SpinBox {
     in property <bool> enabled <=> base.enabled;
     in property <bool> read-only <=> base.read-only;
     in property <int> step-size <=> base.step-size;
+    in property <string> font-family <=> base.font-family;
+    in property <bool> font-italic <=> base.font-italic;
     in property <TextHorizontalAlignment> horizontal-alignment <=> base.horizontal-alignment;
     out property <bool> has-focus <=> base.has-focus;
     in-out property <int> value <=> base.value;

internal/compiler/widgets/fluent/spinbox.slint

@@ -41,6 +41,8 @@ export component SpinBox {
     in property <int> step-size <=> base.step-size;
     in property <bool> read-only <=> base.read-only;
     in property <TextHorizontalAlignment> horizontal-alignment <=> base.horizontal-alignment;
+    in property <string> font-family <=> base.font-family;
+    in property <bool> font-italic <=> base.font-italic;
     out property <bool> has-focus <=> base.has-focus;
     in-out property <int> value <=> base.value;
 

internal/compiler/widgets/material/spinbox.slint

@@ -63,6 +63,8 @@ export component SpinBox {
     in property <bool> enabled <=> base.enabled;
     in property <int> step-size <=> base.step-size;
     in property <bool> read-only <=> base.read-only;
+    in property <string> font-family <=> base.font-family;
+    in property <bool> font-italic <=> base.font-italic;
     in property <TextHorizontalAlignment> horizontal-alignment <=> base.horizontal-alignment;
     out property <bool> has-focus <=> base.has-focus;
     in-out property <int> value <=> base.value;

tests/cases/widgets/spinbox_font.slint

@@ -0,0 +1,31 @@
+// Copyright © SixtyFPS GmbH <info@slint.dev>
+// SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-2.0 OR LicenseRef-Slint-Software-3.0
+
+import { SpinBox } from "std-widgets.slint";
+
+export component TestCase inherits Window {
+    width: 100px;
+    height: 100px;
+
+    box := SpinBox {
+        font-family: "DejaVu Serif";
+        font-italic: true;
+    }
+
+    out property <bool> test: box.font-family == "DejaVu Serif" && box.font-italic;
+}
+
+/*
+
+```rust
+let instance = TestCase::new().unwrap();
+assert!(instance.get_test());
+```
+
+```cpp
+auto handle = TestCase::create();
+const TestCase &instance = *handle;
+assert(instance.get_test());
+```
+
+*/