Search code examples
c#uwp

Text moving in texbox when changing height on window


I have a problem with my textbox, every time i change the heigt of the window the text in my textbox move uppwords and in som cases disapear completely. Form me it dosn't make anny sence, maby somone could help me and explane why the problem apear. I found it hard when trying do make your applictaion responsiv to understand why it dosn't behave as you would like it to

    x:Class="Labb_2_Calculator.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Labb_2_Calculator"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid Background="WhiteSmoke" KeyDown="Grid_KeyDown">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <TextBox Background="White" Foreground="Black" IsReadOnly="True" Name="TextResault" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" Height="160" HorizontalAlignment="Stretch" VerticalAlignment="Center" Width="1420" Margin="10" FontSize="80" Text="0"></TextBox>
        <TextBlock Foreground="Black" Name="TextNumber" TextTrimming="CharacterEllipsis" Width="Auto" Height="Auto"  Grid.Column="3" Text="" FontSize="60" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="10"></TextBlock>
        <Button Name="button1" Click="Button_Click" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="1" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>1</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_1" Grid.Column="1" Background="LightGray" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="10" Grid.Row="1" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>2</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_2" Grid.Column="2" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="1" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>3</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_3" Grid.Column="3" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="1" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>+</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_4" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="2" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>4</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_5" Grid.Column="1" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="2" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>5</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_6" Grid.Column="2" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="2" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>6</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_7" Grid.Column="4" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="2" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>-</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_8" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="3" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>7</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_9" Grid.Column="1" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="3" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>8</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_10" Grid.Column="2" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="3" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>9</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_11" Grid.Column="3" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="3" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>X</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_12" Background="orange" HorizontalAlignment="Stretch" Margin="10" Grid.Row="4" FontSize="120" >
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>C</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_13" Grid.Column="1" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="4" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>0</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_14" Grid.Column="2" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="4" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>=</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
        <Button Click="Button_Click_15" Grid.Column="3" Background="LightGray" HorizontalAlignment="Stretch" Margin="10" Grid.Row="4" FontSize="120">
            <Button.ContentTemplate>
                <DataTemplate>
                    <Viewbox>
                        <TextBlock>/</TextBlock>
                    </Viewbox>
                </DataTemplate>
            </Button.ContentTemplate>
        </Button>
    </Grid>
</Page>```


Solution

  • You could wrap your TextBox inside of a ViewBox like this:

    <Viewbox Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" Stretch="Fill" StretchDirection="DownOnly" Margin="10" >
        <TextBox Background="White" VerticalContentAlignment="Center" IsReadOnly="True" Name="TextResault" Height="160"  Width="1420" FontSize="80" Text="10110101"/>
    </Viewbox>
    

    This scales your textbox and its font size.