Skip to content

Conversation

@mhduiy
Copy link
Contributor

@mhduiy mhduiy commented Feb 10, 2026

  1. Modified topPadding and bottomPadding to be 0 when control.flat is true, removing extra vertical padding in flat mode
  2. Changed implicitHeight to 30 for flat ComboBox to provide consistent height
  3. Set Loader active to always true to ensure background components are properly loaded
  4. Added flatBackground palette with semi-transparent colors for different states (normal, hovered, pressed) in both light and dark themes
  5. Made background panel visible only in non-flat mode or when flat ComboBox is in pressed/hovered state
  6. Updated color1 property to use flatBackground palette when control is flat

These changes ensure that flat ComboBox components have proper visual styling with appropriate padding, height, and background colors that respond to user interaction states while maintaining a minimal appearance.

Log: Improved visual styling for flat ComboBox with better padding and interactive states

fix: 调整扁平样式ComboBox的内边距和背景

  1. 当control.flat为true时,将topPadding和bottomPadding修改为0,移除扁平 模式下的额外垂直内边距
  2. 将扁平ComboBox的implicitHeight改为30,以提供一致的高度
  3. 将Loader的active设置为始终为true,确保背景组件正确加载
  4. 添加了flatBackground调色板,包含适用于浅色和深色主题的不同状态(正 常、悬停、按下)的半透明颜色
  5. 使背景面板仅在非扁平模式或扁平ComboBox处于按下/悬停状态时可见
  6. 更新color1属性,在控件为扁平时使用flatBackground调色板

这些更改确保扁平ComboBox组件具有适当的视觉样式,包括合适的内边距、高度和
响应交互状态的背景颜色,同时保持简约的外观。

Log: 改进了扁平ComboBox的视觉样式,提供更好的内边距和交互状态

PMS: BUG-304333

Summary by Sourcery

Adjust flat ComboBox layout and visual styling for consistent minimal appearance and interactive states.

Enhancements:

  • Remove extra vertical padding for flat ComboBox variants and set a fixed implicit height in flat mode.
  • Always load the background component and conditionally show the background panel for flat ComboBox based on hover/pressed state.
  • Introduce a semi-transparent flat background palette for light and dark themes and apply it to flat ComboBox backgrounds.

@sourcery-ai
Copy link

sourcery-ai bot commented Feb 10, 2026

Reviewer's Guide

Adjusts the flat ComboBox visual style by removing extra vertical padding, customizing implicit height, always loading the background, and introducing a dedicated flat background palette with state-dependent visibility and colors.

Sequence diagram for flat ComboBox background behavior on state changes

sequenceDiagram
    actor User
    participant ComboBox
    participant BackgroundItem
    participant Loader
    participant ButtonPanel

    User->>ComboBox: Open view
    ComboBox->>BackgroundItem: Initialize implicitWidth and implicitHeight
    BackgroundItem->>Loader: Create and set anchors.fill
    Loader->>Loader: active = true
    Loader->>ButtonPanel: Instantiate floatingComponent
    ButtonPanel->>ButtonPanel: Evaluate flat
    ButtonPanel->>ButtonPanel: Set color1 = flatBackground
    ButtonPanel->>ButtonPanel: Set outsideBorderColor = null
    ButtonPanel->>ButtonPanel: Set visible = !flat

    User->>ComboBox: Hover flat ComboBox
    ComboBox->>ButtonPanel: Update controlState to HoveredState
    ButtonPanel->>ButtonPanel: visible = true (flat and hovered)
    ButtonPanel->>ButtonPanel: color1 = flatBackground.hovered or hoveredDark

    User->>ComboBox: Press flat ComboBox
    ComboBox->>ButtonPanel: Update controlState to PressedState
    ButtonPanel->>ButtonPanel: visible = true (flat and pressed)
    ButtonPanel->>ButtonPanel: color1 = flatBackground.pressed or pressedDark

    User->>ComboBox: Release and move cursor away
    ComboBox->>ButtonPanel: Update controlState to Normal
    ButtonPanel->>ButtonPanel: visible = false when flat and not hovered or pressed
    ButtonPanel->>ButtonPanel: color1 = flatBackground.normal or normalDark
Loading

Class diagram for updated flat ComboBox styling

classDiagram
    class ComboBox {
        bool flat
        int padding
        int leftPadding
        int rightPadding
        int topPadding
        int bottomPadding
        int implicitContentWidth
    }

    class ComboBoxBackgroundItem {
        int implicitWidth
        int implicitHeight
    }

    class BackgroundLoader {
        bool active
        Component sourceComponent
        ComboBox comboBox
    }

    class FloatingComponent {
    }

    class ButtonPanel {
        ComboBox button
        D_Palette color1
        color outsideBorderColor
        bool visible
        D_Palette flatBackground
    }

    class D_Palette {
        color normal_common
        color normalDark_common
        color hovered_common
        color hoveredDark_common
        color pressed_common
        color pressedDark_common
    }

    ComboBox "1" o-- "1" ComboBoxBackgroundItem : background
    ComboBoxBackgroundItem "1" o-- "1" BackgroundLoader : loader
    BackgroundLoader "1" o-- "1" FloatingComponent : sourceComponent
    FloatingComponent "1" o-- "1" ButtonPanel : root
    ButtonPanel "1" o-- "1" ComboBox : button
    ButtonPanel "1" o-- "1" D_Palette : flatBackground

    ComboBoxBackgroundItem : implicitWidth = flat ? implicitContentWidth + leftPadding + rightPadding else DS_Style_comboBox_width
    ComboBoxBackgroundItem : implicitHeight = flat ? 30 else DS_Style_comboBox_height

    ComboBox : topPadding = flat ? 0 else padding
    ComboBox : bottomPadding = flat ? 0 else padding

    BackgroundLoader : active = true

    ButtonPanel : color1 = flat ? flatBackground else DS_Style_button_background1
    ButtonPanel : outsideBorderColor = flat ? null else DS_Style_button_outsideBorder
    ButtonPanel : visible = !flat || controlStatePressed || controlStateHovered
Loading

File-Level Changes

Change Details Files
Align flat ComboBox padding and sizing with a minimal, flat appearance.
  • Set topPadding and bottomPadding to 0 when the control is flat to remove extra vertical space.
  • Set background implicitHeight to 30 when the control is flat while keeping the existing styled height otherwise.
qt6/src/qml/ComboBox.qml
Ensure background visuals are always available while adapting them for flat vs non-flat states.
  • Set the background Loader to always be active instead of disabling it in flat mode.
  • Updated the background ButtonPanel to use a flat-specific color palette when the control is flat.
  • Disabled the outside border in flat mode by setting outsideBorderColor to null.
  • Made the background panel visible only when not flat, or when the flat control is hovered/pressed to show interactive feedback.
qt6/src/qml/ComboBox.qml
Introduce a flat background palette tuned for light/dark themes and interaction states.
  • Added a flatBackground D.Palette with semi-transparent colors for normal, hovered, and pressed states in both light and dark modes.
  • Wired ButtonPanel.color1 to flatBackground when the control is flat to drive background colors from the new palette.
qt6/src/qml/ComboBox.qml

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@mhduiy mhduiy requested a review from 18202781743 February 10, 2026 09:25
Copy link

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - I've left some high level feedback:

  • The hardcoded implicitHeight: control.flat ? 30 : DS.Style.comboBox.height introduces a magic number; consider deriving the flat height from the existing style metrics so it stays consistent if theme sizing changes.
  • Setting the Loader to active: true for all modes may keep background components alive unnecessarily; if possible, tighten the activation condition (e.g., based on visibility or flat state) to avoid extra work.
  • The flatBackground palette is defined inline in floatingComponent; if this palette will be reused across controls, consider extracting it into a shared style/palette definition to avoid duplication and ease future adjustments.
Prompt for AI Agents
Please address the comments from this code review:

## Overall Comments
- The hardcoded `implicitHeight: control.flat ? 30 : DS.Style.comboBox.height` introduces a magic number; consider deriving the flat height from the existing style metrics so it stays consistent if theme sizing changes.
- Setting the `Loader` to `active: true` for all modes may keep background components alive unnecessarily; if possible, tighten the activation condition (e.g., based on visibility or flat state) to avoid extra work.
- The `flatBackground` palette is defined inline in `floatingComponent`; if this palette will be reused across controls, consider extracting it into a shared style/palette definition to avoid duplication and ease future adjustments.

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

18202781743
18202781743 previously approved these changes Feb 10, 2026
1. Modified topPadding and bottomPadding to be 0 when control.flat is
true, removing extra vertical padding in flat mode
2. Changed implicitHeight to 30 for flat ComboBox to provide consistent
height
3. Set Loader active to always true to ensure background components are
properly loaded
4. Added flatBackground palette with semi-transparent colors for
different states (normal, hovered, pressed) in both light and dark
themes
5. Made background panel visible only in non-flat mode or when flat
ComboBox is in pressed/hovered state
6. Updated color1 property to use flatBackground palette when control
is flat

These changes ensure that flat ComboBox components have proper visual
styling with appropriate padding, height, and background colors
that respond to user interaction states while maintaining a minimal
appearance.

Log: Improved visual styling for flat ComboBox with better padding and
interactive states

fix: 调整扁平样式ComboBox的内边距和背景

1. 当control.flat为true时,将topPadding和bottomPadding修改为0,移除扁平
模式下的额外垂直内边距
2. 将扁平ComboBox的implicitHeight改为30,以提供一致的高度
3. 将Loader的active设置为始终为true,确保背景组件正确加载
4. 添加了flatBackground调色板,包含适用于浅色和深色主题的不同状态(正
常、悬停、按下)的半透明颜色
5. 使背景面板仅在非扁平模式或扁平ComboBox处于按下/悬停状态时可见
6. 更新color1属性,在控件为扁平时使用flatBackground调色板

这些更改确保扁平ComboBox组件具有适当的视觉样式,包括合适的内边距、高度和
响应交互状态的背景颜色,同时保持简约的外观。

Log: 改进了扁平ComboBox的视觉样式,提供更好的内边距和交互状态

PMS: BUG-304333
@deepin-ci-robot
Copy link
Contributor

deepin pr auto review

这段代码主要修改了 ComboBox 组件以支持扁平化(flat)样式,并更新了 FlowStyle 中的颜色定义。以下是对这段 diff 的详细审查和改进建议:

1. 语法逻辑审查

ComboBox.qml 修改点:

  • ✅ 逻辑正确:topPaddingbottomPadding 根据 control.flat 状态动态调整
  • implicitHeight 逻辑合理:flat 状态下使用固定高度 30,否则使用样式定义的高度
  • ⚠️ background.visible 逻辑:visible: !control.flat || control.D.ColorSelector.controlState === ... 这个逻辑有点复杂,可能导致某些状态下 flat ComboBox 不可见

FlowStyle.qml 修改点:

  • ✅ 颜色定义结构正确,遵循了 D.Palette 的模式
  • ⚠️ hoveredDark 中有多余的括号:(Qt.rgba(0.08, 0.08, 0.08, 0.2)) 应该是 Qt.rgba(0.08, 0.08, 0.08, 0.2)

2. 代码质量改进建议

  1. 硬编码高度值

    implicitHeight: control.flat ? 30 : DS.Style.comboBox.height

    建议:将 30 提取为样式常量,如 DS.Style.comboBox.flatHeight,便于统一维护。

  2. 版权年份更新

    -// SPDX-FileCopyrightText: 2020 - 2022
    +// SPDX-FileCopyrightText: 2020 - 2026

    建议:直接更新到当前年份(2024)更合理,除非有特定原因需要到 2026。

  3. 条件判断简化

    visible: !control.flat || control.D.ColorSelector.controlState === D.DTK.PressedState || control.D.ColorSelector.controlState === D.DTK.HoveredState

    建议提取为属性:

    readonly property bool isInteractive: control.D.ColorSelector.controlState === D.DTK.PressedState || 
                                         control.D.ColorSelector.controlState === D.DTK.HoveredState
    visible: !control.flat || isInteractive

3. 代码性能建议

  1. 频繁属性访问
    control.D.ColorSelector.controlState 被访问了两次,建议:

    readonly property var controlState: control.D.ColorSelector.controlState
    readonly property bool isInteractive: controlState === D.DTK.PressedState || 
                                         controlState === D.DTK.HoveredState
  2. Loader 激活状态
    原代码有 active: !control.flat,新代码移除了这个条件。如果 sourceComponent 在 flat 状态下不变化,建议保留这个优化:

    Loader {
        active: !control.flat || control.editable
        // ...
    }

4. 代码安全建议

  1. 空值检查

    outsideBorderColor: control.flat ? null : DS.Style.button.outsideBorder

    虽然 QML 能处理 null,但建议明确指定默认值:

    outsideBorderColor: control.flat ? "transparent" : DS.Style.button.outsideBorder
  2. 状态枚举值
    直接使用 D.DTK.PressedState 等枚举值,建议确保这些枚举值已定义且不会变更,否则应考虑使用字符串常量或定义本地枚举。

5. 其他建议

  1. 样式一致性
    flatBackground 颜色定义中,normalhovered 的 alpha 值相同(0.1),这可能不是预期行为。建议检查是否应该有区分。

  2. 文档注释
    新增的 flat 样式相关代码缺少注释,建议添加说明:

    // 扁平化样式下,仅在交互状态下显示背景
    visible: !control.flat || isInteractive

总结

这段代码实现了扁平化 ComboBox 的功能,整体逻辑正确,但有以下改进空间:

  1. 移除硬编码值,使用样式常量
  2. 简化复杂的条件判断
  3. 优化属性访问性能
  4. 增加必要的注释
  5. 修正多余的括号

这些改进将使代码更易维护、性能更好且更健壮。

@deepin-ci-robot
Copy link
Contributor

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: 18202781743, mhduiy

The full list of commands accepted by this bot can be found here.

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@mhduiy mhduiy merged commit 6307600 into linuxdeepin:master Feb 10, 2026
17 of 20 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants