שאלה לגבי שימוש ב-ScrollViewer עם טקסט

Question

 

קודם כל תתחדשו על הפורום החדש, זה מעולה שיש סופסוף מקום לשאול בו שאלות ב-WPF ו-XAML בעברית. 

אני בונה אפליקציה יחסית פשוטה, וקיים בה Grid שאני רוצה להציג בו טקסט.

הבעיה היא שאני רוצה מצד אחד להשתמש ב-TextWrapping=Wrap שיחתוך את השורות ומצד שני כאשר הטקסט ארוך מדי, להציג ScrollBar עולה ויורד.

אני גם רוצה שה-TextBlock יתפרש על כל התא שהוא נמצא בו ב-Grid.

השתמשתי ב-ScrollViewer שמכיל TextBlock עם הטקסט.

מה שקורה הוא, שכל עוד אני לא מגביל את גודל ה-ScrollViewer, הוא נותן Width מקסימלי ופורש את כל הטקסט על כל המסך בשורות ארוכות.

אני לא רוצה להגדיר גדלים HardCoded ולא אוהב את השימוש ב-MinWidth או MaxWidth.

זו דוגמא של המקטע ב-Xaml שבניתי (הורדתי את כל ההסתבכויות שלי):

<ScrollViewer Grid.Row="0" Grid.Column="0">
    <TextBlock TextWrapping="Wrap" FontSize="20">
        <TextBlock.Text>
            My Long Text - Has many rows...
        </TextBlock.Text>
    </TextBlock>
</ScrollViewer>

איך אני מגדיר שה-Width של ה-ScrollViewer תלוי ב-Grid ומקבל ממנו את רוחב התא ושה-TextBlock לא ישתלט ויגדיל לי את התא עד אינסוף?

 

תודה רבה על העזרה,
שחר

Answer 1

איך מוגדר התא שבו נמצא ה ScrollViewer? אם התא מוגדר להיות width="auto" זה אכן יצור לך את הבעיה הנ"ל - כל מה שאתה צריך זה לשנות את זה לסוג רוחב אחר כמו *.

Answer 2

במידה ולתא ב- grid יש גובה ספציפי, תוכל להגביל את ה- Height של ה- ScrollViewer בגודל ה- Height של התא.

למשל:

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="100"></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <ScrollViewer Height="100"  VerticalScrollBarVisibility="Auto">
        <TextBlock 
            Text="My Text here..." TextWrapping="Wrap"></TextBlock>
        </ScrollViewer>
    </Grid>

 

Answer 3

אסף - לרשום Height="100" נחשב worst practice ב wpf - אתה מקבל זאמל לא דינאמי.

Answer 4

במקרה שלא שמתם לב, אלעד נתן פתרון!

מה שאלעד התכוון ב- "*", זה תשתמש ב-Grid במה שנקרא Star Sizing כשאתה מגדיר רוחב לעמודה. כך ה- ScrollViewer יקבל אוטומאטית גודל יחסי מאחר והוא Strectched בתוך התא.

הנה דוגמה:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="0.2*" />
        <ColumnDefinition Width="0.8*" />
    </Grid.ColumnDefinitions>

    <ScrollViewer>
        <TextBlock TextWrapping="Wrap" Text="Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text, Text" />
    </ScrollViewer>        
</Grid>

 

---

Please remember to mark the replies as answers if they help and unmark them if they provide no help.