Skip to content

fix: Optimize UI display of the network module#523

Merged
deepin-bot[bot] merged 2 commits intolinuxdeepin:masterfrom
JWWTSL:master
Mar 20, 2026
Merged

fix: Optimize UI display of the network module#523
deepin-bot[bot] merged 2 commits intolinuxdeepin:masterfrom
JWWTSL:master

Conversation

@JWWTSL
Copy link
Contributor

@JWWTSL JWWTSL commented Mar 20, 2026

log: Keep text field widths consistent

pms: bug-337919

Summary by Sourcery

Bug Fixes:

  • Fix inconsistent text field width in the network module file chooser by aligning the row layout and input field sizing with the available space.

@sourcery-ai
Copy link

sourcery-ai bot commented Mar 20, 2026

Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Adjusts the NetFileChooseEdit layout so the text field keeps a consistent width relative to its implicit size and the browse button, and exposes the browse button for layout calculations while retaining its behavior.

Class diagram for updated NetFileChooseEdit layout

classDiagram
    class NetFileChooseEdit {
        +int implicitWidth
        +var dataItem
        +var nameFilters
        +string placeholderText
        +string text
        +bool readOnly
        +bool acceptableInput
    }

    class EditLineEdit {
        +int Layout_preferredWidth
        +string placeholderText
        +string text
        +bool readOnly
        +bool acceptableInput
        +onTextChanged()
        +Component_onCompleted()
    }

    class BrowseButton {
        +string text
        +onClicked()
    }

    NetFileChooseEdit *-- EditLineEdit : contains
    NetFileChooseEdit *-- BrowseButton : contains

    NetFileChooseEdit : implicitWidth = EditLineEdit.implicitWidth
    EditLineEdit : Layout_preferredWidth = EditLineEdit.implicitWidth - BrowseButton.width - NetFileChooseEdit.spacing
    BrowseButton : id browseBtn
Loading

File-Level Changes

Change Details Files
Make NetFileChooseEdit row and line edit widths derive from the line edit’s implicit width while accounting for the browse button, to keep text field width consistent in the UI.
  • Bind the RowLayout implicitWidth to the line edit’s implicitWidth so the overall control width follows the line edit sizing.
  • Set the D.LineEdit Layout.preferredWidth to its implicitWidth minus the browse button width and row spacing so the edit field shrinks to leave room for the button.
  • Assign an id to the browse button so it can be referenced in layout expressions while preserving its existing click behavior.
dcc-network/qml/NetFileChooseEdit.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

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 implicitWidth: edit.implicitWidth on root combined with Layout.preferredWidth: edit.implicitWidth - browseBtn.width - root.spacing inside edit risks a binding loop or unstable layout; consider basing widths on root.width or explicit constants rather than chaining implicitWidth values together.
  • The subtraction edit.implicitWidth - browseBtn.width - root.spacing can easily go negative or behave unexpectedly with different themes/fonts; it would be more robust to use Layout.fillWidth: true for the line edit and rely on the RowLayout to allocate remaining space after the button.
  • The // TEMP: 验证改动是否生效,去掉按钮 comment no longer matches the actual code (the button is still present); either remove the temporary comment or adjust the code so the comment reflects the current behavior.
Prompt for AI Agents
Please address the comments from this code review:

## Overall Comments
- The `implicitWidth: edit.implicitWidth` on `root` combined with `Layout.preferredWidth: edit.implicitWidth - browseBtn.width - root.spacing` inside `edit` risks a binding loop or unstable layout; consider basing widths on `root.width` or explicit constants rather than chaining `implicitWidth` values together.
- The subtraction `edit.implicitWidth - browseBtn.width - root.spacing` can easily go negative or behave unexpectedly with different themes/fonts; it would be more robust to use `Layout.fillWidth: true` for the line edit and rely on the RowLayout to allocate remaining space after the button.
- The `// TEMP: 验证改动是否生效,去掉按钮` comment no longer matches the actual code (the button is still present); either remove the temporary comment or adjust the code so the comment reflects the current behavior.

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.

@deepin-ci-robot
Copy link

deepin pr auto review

这段代码是一个 QML 文件(NetFileChooseEdit.qml)的 diff,主要涉及对 RowLayout 及其子项(D.LineEditNetButton)的布局调整。以下是对该 diff 的详细审查意见,包括语法逻辑、代码质量、代码性能和代码安全方面:


1. 语法逻辑

  • 问题点

    implicitWidth: edit.implicitWidth
    • RowLayoutimplicitWidth 被设置为 edit.implicitWidth,但 editRowLayout 的子项,这可能导致循环依赖或布局计算问题。
    • implicitWidth 应该由子项的宽度之和决定,而不是直接引用子项的 implicitWidth
  • 改进建议

    • 如果目标是让 RowLayout 的宽度适应 D.LineEdit 的内容,可以考虑使用 Layout.fillWidth: true 或明确设置 preferredWidth
    • 例如:
      D.LineEdit {
          id: edit
          Layout.fillWidth: true  // 让 LineEdit 占据剩余空间
      }
  • 问题点

    Layout.preferredWidth: edit.implicitWidth - browseBtn.width - root.spacing
    • edit.implicitWidth 可能未正确计算,尤其是当 LineEdit 的内容动态变化时。
    • 减去 browseBtn.widthroot.spacing 可能导致负宽度或布局不稳定。
  • 改进建议

    • 使用 Layout.fillWidth: trueLineEdit 自动占据剩余空间,而不是手动计算宽度。
    • 例如:
      D.LineEdit {
          id: edit
          Layout.fillWidth: true
      }

2. 代码质量

  • 问题点

    • browseBtnid 被添加,但未在代码中显式使用(除了 Layout.preferredWidth 的计算)。
    • 如果 browseBtn 的宽度是固定的,可以直接硬编码或使用常量。
  • 改进建议

    • 如果 browseBtn 的宽度是固定的,可以定义一个属性:
      property int browseButtonWidth: 30  // 假设按钮宽度为 30
    • 然后使用:
      Layout.preferredWidth: edit.implicitWidth - browseButtonWidth - root.spacing
  • 问题点

    • implicitWidthLayout.preferredWidth 的混用可能导致布局不一致。
  • 改进建议

    • 统一使用 Layout.fillWidthLayout.preferredWidth,避免混用。

3. 代码性能

  • 问题点

    • implicitWidth 的动态计算可能导致频繁的布局重绘,尤其是在 onTextChanged 时。
    • Layout.preferredWidth 的计算依赖于 edit.implicitWidthbrowseBtn.width,可能引发不必要的布局更新。
  • 改进建议

    • 如果 LineEdit 的内容变化频繁,可以缓存 implicitWidth 或使用 Layout.minimumWidthLayout.maximumWidth 限制宽度范围。
    • 例如:
      D.LineEdit {
          id: edit
          Layout.fillWidth: true
          Layout.minimumWidth: 100
          Layout.maximumWidth: 500
      }

4. 代码安全

  • 问题点

    • Layout.preferredWidth 的计算可能导致负宽度,进而引发布局崩溃。
    • 如果 edit.implicitWidth 小于 browseBtn.width + root.spacing,宽度会变为负值。
  • 改进建议

    • 添加宽度限制:
      Layout.preferredWidth: Math.max(0, edit.implicitWidth - browseBtn.width - root.spacing)
    • 或者直接使用 Layout.fillWidth: true 避免手动计算。

5. 其他建议

  • 问题点

    • NetButtontext 是硬编码的 "...",建议使用 qsTr 支持国际化:
      text: qsTr("...")
  • 问题点

    • implicitWidth 的设置可能不符合 RowLayout 的设计意图,建议重新评估布局逻辑。

总结

  1. 语法逻辑:避免 implicitWidth 的循环依赖,改用 Layout.fillWidth 或明确的宽度设置。
  2. 代码质量:统一使用 Layout.fillWidthLayout.preferredWidth,避免混用。
  3. 代码性能:减少动态计算,使用 Layout.minimumWidthLayout.maximumWidth 限制宽度范围。
  4. 代码安全:避免负宽度,添加 Math.max(0, ...) 保护。
  5. 其他:支持国际化,使用 qsTr

改进后的代码示例

RowLayout {
    id: root
    property var dataItem
    property var nameFilters: [qsTr("All files (*)")]
    property alias placeholderText: edit.placeholderText
    property alias text: edit.text
    property alias buttonVisible: browseBtn.visible

    spacing: 10  // 显式定义间距

    D.LineEdit {
        id: edit
        Layout.fillWidth: true  // 自动占据剩余空间
        Layout.minimumWidth: 100
        Layout.maximumWidth: 500
        onTextChanged: {
            if (!initialized) {
                return
            }
            dataItem = text
        }
        Component.onCompleted: initialized = true
    }

    NetButton {
        id: browseBtn
        text: qsTr("...")
        onClicked: {
            fileDialog.createObject(this).open()
        }
    }
}

这样改进后,代码更清晰、性能更好,且避免了潜在的布局问题。

log: Keep text field widths consistent

pms: bug-337919
@deepin-ci-robot
Copy link

[APPROVALNOTIFIER] This PR is NOT APPROVED

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

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

@JWWTSL
Copy link
Contributor Author

JWWTSL commented Mar 20, 2026

/forcemerge

@deepin-bot
Copy link
Contributor

deepin-bot bot commented Mar 20, 2026

This pr force merged! (status: unstable)

@deepin-bot deepin-bot bot merged commit 3511a2b into linuxdeepin:master Mar 20, 2026
12 of 14 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