(Marquee) When Behavior="Looping" and Direction is set to vertical, it causes “Layout cycle detected. Layout could not complete.”

オープン
  • 何か問題がありますか？
#755 コメント 1 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
42/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
停滞
技術スタック
csharp
領域
frontend

調査の方向性

提供された Marquee マークアップで Behavior="Looping" および Direction="Down" を使用してクラッシュを再現します。components/Marquee/src/Marquee.xaml、Marquee.cs の 69、211、241 行目、および Marquee.Events.cs の 36、62 行目を読み、SizeChanged のサブスクリプションとセグメントの可視性の変更に注目してください。垂直方向の looping によってレイアウトサイクルやクラッシュが発生しなくなり、コンテナーが繰り返しサブスクライブされなくなれば完了です。

索引モデルが issue の本文から書いたものです。

説明

bug :bug:
Describe the bug

https://github.com/CommunityToolkit/Labs-Windows/blob/acda1c3df1b71dbf77bc80a0544eae7955398d49/components/Marquee/src/Marquee.xaml#L9

https://github.com/CommunityToolkit/Labs-Windows/blob/acda1c3df1b71dbf77bc80a0544eae7955398d49/components/Marquee/src/Marquee.Events.cs#L62

https://github.com/CommunityToolkit/Labs-Windows/blob/acda1c3df1b71dbf77bc80a0544eae7955398d49/components/Marquee/src/Marquee.cs#L241

https://github.com/CommunityToolkit/Labs-Windows/blob/acda1c3df1b71dbf77bc80a0544eae7955398d49/components/Marquee/src/Marquee.cs#L211

I noticed that the Marquee control crashes. After debugging, I believe the SizeChanged event causes the visibility of segment2 to change. Since the control’s default vertical alignment is set to Top, this triggers another SizeChanged event, resulting in an infinite loop.
Setting VerticalAlignment="Stretch" allows it to work correctly, but this is not a real solution.

In addition, I noticed that _marqueeContainer is repeatedly subscribing to the SizeChanged event.
https://github.com/CommunityToolkit/Labs-Windows/blob/acda1c3df1b71dbf77bc80a0544eae7955398d49/components/Marquee/src/Marquee.cs#L69

https://github.com/CommunityToolkit/Labs-Windows/blob/acda1c3df1b71dbf77bc80a0544eae7955398d49/components/Marquee/src/Marquee.Events.cs#L36

Steps to reproduce
<labs:Marquee
     Behavior="Looping"
     Content="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
     Direction="Down"
     FontSize="18"
     RepeatBehavior="Forever"
     Speed="200" />


Just setting Behavior="Looping" is enough to trigger the crash.
Expected behavior

This shouldn't cause the program to crash.

Screenshots
Image
Code Platform
  • UWP
  • WinAppSDK / WinUI 3
  • Web Assembly (WASM)
  • Android
  • iOS
  • MacOS
  • Linux / GTK
Windows Build Number
  • Windows 10 1809 (Build 17763)
  • Windows 10 1903 (Build 18362)
  • Windows 10 1909 (Build 18363)
  • Windows 10 2004 (Build 19041)
  • Windows 10 20H2 (Build 19042)
  • Windows 10 21H1 (Build 19043)
  • Windows 11 21H2 (Build 22000)
  • Other (specify)
Other Windows Build number

No response

App minimum and target SDK version
  • Windows 10, version 1809 (Build 17763)
  • Windows 10, version 1903 (Build 18362)
  • Windows 10, version 1909 (Build 18363)
  • Windows 10, version 2004 (Build 19041)
  • Other (specify)
Other SDK version

No response

Visual Studio Version

No response

Visual Studio Build Number

No response

Device form factor

No response

Additional context

No response

主要言語
C#
スター
485
フォーク
89
平均マージ
19時間 46分
マージ済み PR（30日）
2

環境構築

Codespaces で開く

このプロジェクトの開発コンテナを、あなたの GitHub アカウントでブラウザ上に起動します。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

CommunityToolkit/Labs-Windows のほかの issue

CommunityToolkit/Labs-Windows の issue をすべて見る

似ている issue

C# の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。