ระยะขอบของบล็อกข้อความทำให้ข้อความอยู่นอกขอบเขต

ขณะนี้ฉันกำลังพยายามสร้างองค์ประกอบภาพเพื่อให้มีการเลื่อนข้อความ (จากซ้ายไปขวาและจากขวาไปซ้าย) - ค่อนข้างเป็นกระโจม html

ฉันมีตารางที่แบ่งออกเป็นหลายคอลัมน์และแถว และฉันต้องการวางส่วนประกอบของฉันไว้ในช่องตารางช่องใดช่องหนึ่ง

ตาราง (ชื่อ UIGrid) ถูกสร้างขึ้นดังนี้:

for (int i = 0; i < xDivisions; i++)
{
    ColumnDefinition newColumn = new ColumnDefinition();
    UIGrid.ColumnDefinitions.Add(newColumn);
}
for (int i = 0; i < yDivisions; i++)
{
    RowDefinition newRow = new RowDefinition();
    UIGrid.RowDefinitions.Add(newRow);
}

ส่วนประกอบที่ฉันกำลังเพิ่มเป็นเพียงเส้นขอบที่มีบล็อกข้อความตอนเด็กๆ ฉันวางเส้นขอบภายใน Grid เช่นนี้:

border = new Border();
Grid.SetColumn(border, xPosition);
Grid.SetRow(border, yPosition);

textBlock = new TextBlock();
border.Child = textBlock;
textBlock.Text = "Scrolling text from left to right";

UIGrid.Children.Add(border);

ฉันใช้ตัวจับเวลาเพื่อเพิ่มระยะขอบของบล็อกข้อความ นี่คือตัวจับเวลาการโทรกลับเนื้อความที่เรียบง่าย:

textBlock.Measure(new Size(double.PositiveInfinity, double.PositiveInfinity));
double textWidth = textBlock.DesiredSize.Width;
double visibleWidth = componentBase.ActualWidth;
double targetMargin = textWidth < visibleWidth ? visibleWidth : textWidth;

if (margin.Left == targetMargin)
{
    margin.Left = -textWidth;
} else
{
    margin.Left++;
}

เมื่อข้อความเลื่อนจากซ้ายไปขวา ข้อความจะทำงานได้ดี : https://s10.postimg.org/p0nt7vl09/text_good.png ส่งข้อความ "ออก" ช่องกริดถูกซ่อนอยู่

อย่างไรก็ตาม เมื่อฉันตั้งค่าระยะขอบของบล็อกข้อความเป็นลบ ดังนั้นบล็อกอาจกลับเข้ามาในพื้นที่ที่มองเห็นได้จากด้านซ้าย ข้อความจะมองเห็นได้แม้ว่าจะอยู่นอกช่องที่จัดสรรไว้ก็ตาม : https://s10.postimg.org/pownqtjq1/text_bad.png

ฉันได้ลองใช้ช่องว่างภายในแทน แต่ฉันไม่สามารถตั้งค่าช่องว่างภายในที่เป็นลบได้ ฉันได้ลองทำอย่างอื่นบ้างแล้ว แต่ฉันรู้สึกเหมือนเจออุปสรรค

ฉันจะทำอย่างไรเพื่อให้ได้ข้อความเลื่อนที่สวยงาม


person Valentin Schneider    schedule 11.08.2016    source แหล่งที่มา
comment
คงจะดีถ้าคุณโพสต์ grid xaml เพื่อให้เราเห็นว่าเกิดอะไรขึ้น ตอนนี้ลองตั้งค่า Textblock แนวนอน Alignment ภายใน Grid to Stretch   -  person AVK    schedule 11.08.2016
comment
@AVKNaidu การเปลี่ยนการจัดแนวแนวนอนของ Textblock หรือ Border ไม่ได้เปลี่ยนพฤติกรรมการเลื่อน =(   -  person Valentin Schneider    schedule 11.08.2016
comment
ฉันอยากรู้ว่าทำไมพวกคุณถึงหวาดระแวงเกี่ยวกับการแบ่งปันโค้ดหรือพูดอย่างชัดเจนว่าปัญหาที่แท้จริงของคุณคืออะไร อย่างไรก็ตาม ค้นหาการควบคุมที่อยู่นอกสุดของคุณ (ฉันคิดว่าอาจเป็น Grid) แล้วตั้งค่า ClipToBounds="True" ลงไป นั่นอาจช่วยแก้ปัญหาของคุณได้อย่างน้อยก็ส่วนหนึ่งถึงแม้ว่ามันจะยากที่จะแน่ใจเพราะคุณเป็นคนเก็บความลับมาก   -  person 15ee8f99-57ff-4f92-890c-b56153    schedule 11.08.2016
comment
@EdPlunkett โอ้ มันไม่ได้เป็นความลับจริงๆ ฉันแค่ไม่ต้องการที่จะทิ้งโค้ดทั้งหมดของฉันแล้วพูดที่นี่ โปรดแก้ไขข้อบกพร่องนี้ด้วย ฉันยอมรับว่าฉันสามารถแสดงโค้ดมากกว่านี้ได้ ลบคะแนนสำหรับฉัน สำหรับ 'ClipToBounds' ดูเหมือนว่าจะไม่มีคุณสมบัติดังกล่าวใน UWP มีเพียงคุณสมบัติ 'Clip' ที่เป็นสี่เหลี่ยมผืนผ้าที่ฉันต้องตั้งค่าเอง ฉันยังคงต่อสู้กับมัน   -  person Valentin Schneider    schedule 12.08.2016


คำตอบ (2)


หากคุณต้องการข้อความที่เลื่อนอย่างสวยงาม ListView อาจเป็นตัวเลือกที่ดีกว่า มันเป็นแบบไดนามิกและคุณสามารถผูกมันเข้ากับวัตถุของคุณได้ การคาดเดานี้จะใช้เวลามาก

person Phia-CM    schedule 11.08.2016

Ed Plunkett นำฉันไปในทิศทางที่ถูกต้องด้วยคุณสมบัติ Clip แนวคิดคือการทำสิ่งนี้:

border.Clip = new RectangleGeometry
{
    Rect = new Rect(0, 0, border.ActualWidth, border.ActualHeight)
};

แน่นอนว่ามันจะใช้ไม่ได้หากเส้นขอบยังไม่ถูกเรนเดอร์ (และแน่นอนว่าจะไม่ได้ผลเมื่อโค้ดของฉันกำลังทำงาน) คุณสามารถบังคับให้การวัดเกิดขึ้นได้โดยใช้ "การวัด" เช่นเดียวกับที่ฉันวัดความยาวของข้อความเป็นพิกเซล แต่มันมีพฤติกรรมแปลก ๆ ที่ขอบของฉัน ฉันจะไม่ได้ขนาดที่ถูกต้องเลย

ในท้ายที่สุด ฉันเพียงสมัครรับเหตุการณ์ SizeChanged ของชายแดน :

border.SizeChanged += OnSizeComputed;

เมื่อเหตุการณ์นั้นเกิดขึ้น ฉันจะสร้าง TriangleGeometry โดยใช้ ActualWidth & ActualHeight

person Valentin Schneider    schedule 12.08.2016