Textbox corner rectangle color

[henrik-oscarsson]

When using the TextBox control, and you set the TextWrapping property to NoWrap (important), there is an odd-colored rectangle in the bottom-right corner (between the scrollbars). See attached screenshots. They are taken from the existing Demo project, where I added a textbox. The trick is to set the TextWrapping property to NoWrap. I spent some time tracing it using Snoop, but haven't figured out a way to fix it.

I have provided a repro in a branch named textbox: https://github.com/blooksa/MahApps.Metro/tree/textbox
(A one-line change, I simply added a textbox in the MainWindow).

[ghost]

You're right thats... odd. It's hosted inside PART_ContentHost, but thats 'just' a scrollviewer (<ScrollViewer x:Name="PART_ContentHost" BorderThickness="0" IsTabStop="False" Margin="2" VerticalAlignment="Stretch" Background="{x:Null}" />)

Without the element having a name, its a little tricky to track down.

Nothing has the fill of #F0F0F0.

I'll see if I can match it to anything else.

[ghost]

Success! The issue was that MA.M doesn't have a ScrollViewer template and that grey rectangle (which happened to be set to {DynamicResource {x:Static SystemColors.ControlBrushKey}}) is that its actually part of the default (stock WPF) ScrollViewer template.

Several elements like the ScrollBars (and elements inside that) are replaced by MA.M, but not specifically a ScrollViewer style

    <Style TargetType="{x:Type ScrollViewer}">
        <Setter Property="Template">
            <Setter.Value>
        <ControlTemplate TargetType="{x:Type ScrollViewer}">
            <Grid x:Name="Grid" Background="{TemplateBinding Background}">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <Rectangle x:Name="Corner" Grid.Column="1" Fill="Red" Grid.Row="1"/>
                <ScrollContentPresenter x:Name="PART_ScrollContentPresenter" CanContentScroll="{TemplateBinding CanContentScroll}" CanHorizontallyScroll="False" CanVerticallyScroll="False" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="0" Margin="{TemplateBinding Padding}" Grid.Row="0"/>
                <ScrollBar x:Name="PART_VerticalScrollBar" AutomationProperties.AutomationId="VerticalScrollBar" Cursor="Arrow" Grid.Column="1" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Grid.Row="0" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ViewportHeight}"/>
                <ScrollBar x:Name="PART_HorizontalScrollBar" AutomationProperties.AutomationId="HorizontalScrollBar" Cursor="Arrow" Grid.Column="0" Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Orientation="Horizontal" Grid.Row="1" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ViewportWidth}"/>
            </Grid>
        </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

results in

So the question do you, @Blooksa, is what would you like done with it? Just dump the rectangle entirely?

[henrik-oscarsson]

Thanks!