[UWP][XAML] not displaying TextBox content

1
votes

Before posting this issue I have searched and studied alot all answers given on StackOverflow but none did help me, so here I am ^^

My goal is to get the corresponsive of a Label in UWP using TextBox.

  • In TextBox property I have set "IsReadOnly="True"" but the "box" was still visible even if its property was set on Transparent.

  • So I have also added "IsEnabled="False"" Property and I have obtained my "label".

-

But, due to project requirements, I needed a white text and not the default-grey-text of uwp. So I have tried to set a custom style (following all answers from stackOverflow) until I have found this solution:

 <Style x:Key="Titoli" TargetType="TextBox">
            <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
            <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="SelectionHighlightColor" Value="{ThemeResource SystemControlHighlightAccentBrush}" />
            <Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" />
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
            <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
            <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" />
            <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}"/>
            <Setter Property="IsReadOnly" Value="True"  />
            <Setter Property="Background" Value="{x:Null}" />
            <Setter Property="IsHitTestVisible"  Value="False"  />

            <Setter Property="Template" >
                <Setter.Value>
                    <ControlTemplate TargetType="TextBox">
                        <Border x:Name="ContentElement" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

And obtaining this Preview (T1,T2,T3 ecc are the labels I am focusing):

Preview

But when I'll Debug, the app have this look:

Debug

So no textbox is "printed" out... I really can't figure out a solution (Also my custom bottons-images are disappeared!) Any suggestion?

I have also copy-pasted the full TextBox from here and modified but I can't retrieve the solution in the first screen in this way...

code snippet of Xaml.MainPage:

 <Grid.ColumnDefinitions>
        <!--Definisco quante colonne voglio e come siano definite -->
        <ColumnDefinition Width="15*"/>
        <!-- Colonna per AGGIUNTE SUCCESSIVE -->
        <ColumnDefinition Width="15*"/>
        <!-- Colonna per Box dati -->
        <ColumnDefinition Width="*"/>
        <!-- Colonna per il sito a lato -->
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <!--Definisco quante righe voglio e come siano definite -->
        <RowDefinition Height="30*"/>
        <!-- riga per definire spazio per box dati -->
        <RowDefinition Height="15*"/>
        <RowDefinition Height="15*"/>
    </Grid.RowDefinitions>

    <!-- *********************** Sezione display sonde **************************** -->

    <!-- Sezione Unità di Misura -->

    <TextBox Text="°C" TextWrapping="Wrap"  IsEnabled="False" Margin="285,146,374,282"  Style="{StaticResource Titoli}" Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" HorizontalAlignment="Stretch"/>
    <TextBox Text="°C" TextWrapping="Wrap"  IsEnabled="False" Margin="567,146,92,282"  Style="{StaticResource Titoli}" Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" VerticalAlignment="Stretch"/>
    <TextBox Text="°C" TextWrapping="Wrap"  IsEnabled="False" Margin="285,313,374,115"  Style="{StaticResource Titoli}" Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" VerticalAlignment="Stretch"/>
    <TextBox Text="°C" TextWrapping="Wrap"  IsEnabled="False" Margin="567,313,92,115"  Style="{StaticResource Titoli}" Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" HorizontalAlignment="Stretch"/>


    <!-- Sezione Numerazione Sonde -->
    <TextBox Text="T1" TextWrapping="Wrap"  IsEnabled="False" Margin="278,94,348,308"  Style="{StaticResource Titoli}" FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="LeftPosition, RightPosition, TopPosition, BottomPosition" VerticalAlignment="Stretch"/>
    <TextBox Text="T2" TextWrapping="Wrap"  IsEnabled="False" Margin="560,94,66,308"  Style="{StaticResource Titoli}" FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="TopPosition, BottomPosition" Width="71"/>
    <TextBox Text="T3" TextWrapping="Wrap"  IsEnabled="False" Margin="278,261,348,141"  Style="{StaticResource Titoli}" FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="LeftPosition, RightPosition, TopPosition, BottomPosition" HorizontalAlignment="Stretch"/>
    <TextBox Text="T4" TextWrapping="Wrap"  IsEnabled="False" Margin="560,261,66,141"  Style="{StaticResource Titoli}" FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="TopPosition, BottomPosition" VerticalAlignment="Stretch" Width="71"/>

    <!-- Sezione Valori di Misura -->

---------------EDIT As suggested by @touseefbsb here is the version with TextBlock, but still, none is displayed in Debug...

 <!-- Sezione Unità di Misura -->

    <TextBlock Text="°C" TextWrapping="Wrap"  IsTapEnabled="False"  Margin="285,146,369,290" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="TopPosition, BottomPosition" Foreground="White" Width="43" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
    <TextBlock Text="°C" TextWrapping="Wrap"  IsTapEnabled="False" Margin="567,146,92,282"   Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" VerticalAlignment="Stretch" Foreground="White"/>
    <TextBlock Text="°C" TextWrapping="Wrap" IsTapEnabled="False" Margin="285,313,374,115"   Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" VerticalAlignment="Stretch" Foreground="White"/>
    <TextBlock Text="°C" TextWrapping="Wrap"  IsTapEnabled="False" Margin="567,313,92,115"   Height="52" Width="38" FontSize="36" FontFamily="Calibri Light" Grid.Column="1" HorizontalAlignment="Stretch" Foreground="White"/>


    <!-- Sezione Numerazione Sonde -->
    <TextBlock Text="T1" TextWrapping="Wrap"  IsTapEnabled="False" Margin="277,94,357,335"   FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="LeftPosition, RightPosition, TopPosition, BottomPosition" FocusVisualPrimaryBrush="White" Foreground="White"/>
    <TextBlock Text="T2" TextWrapping="Wrap"  IsTapEnabled="False" Margin="560,94,66,343"   FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="TopPosition, BottomPosition" Width="71" FocusVisualPrimaryBrush="White" Foreground="White" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
    <TextBlock Text="T3" TextWrapping="Wrap"  IsTapEnabled="False" Margin="285,261,344,163"   FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="HorizontalAlignment, TopPosition, BottomPosition" FocusVisualPrimaryBrush="White" Foreground="White" Width="68" RenderTransformOrigin="0.397,0.913"/>
    <TextBlock Text="T4" TextWrapping="Wrap"  IsTapEnabled="False" Margin="560,261,66,175"   FontSize="48" FontFamily="Calibri Light" Grid.Column="1" d:LayoutOverrides="TopPosition, BottomPosition" Width="71" FocusVisualPrimaryBrush="White" Foreground="White" VerticalAlignment="Stretch"/>

    <!-- Sezione Valori di Misura -->
1
c#xamluwp
if you just want to display text why not using a simple TextBlock ? – Muhammad Touseef
I tried but I did not achieve the first screen setup, obtaining the same issue described forward – Lemon Pies
basically you want a 2 line Textblock so that T1 can appear in one line and .C can appear in 2nd? – Muhammad Touseef
yes that's my goal, you may suggest to use stack panels? – Lemon Pies
Nop, just reduce the width of your textblock, make the fontsize bigger ( as required by the app ) and set the textwrapping to "wrapwordsonly" now when the text="T1 C" notice there is a space so there are 2 words here, this way you will achieve exactly what you want with 1 textblock only. – Muhammad Touseef

1 Answers

2
votes

Ok, after @touseefbsb I managed to get a solution.

Organizing in Stackpanels and adjusting views with ViewBox in Stretch="Uniform" here is what I have obtained:

<Viewbox Stretch="Uniform">
<Grid  >

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="2*"/>
        <ColumnDefinition Width="3*"/>

    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="2*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <!-- Sezione Segnali -->
    <StackPanel>
        <GridView>
            ....
        </GridView>

    </StackPanel>

    <!-- Sezione Display temperature -->
    <StackPanel Grid.Column="1">

        <GridView>
            <TextBlock x:Name="Sonda_1" TextWrapping="WrapWholeWords" Margin="90 91 -90 10"  FontSize="120" FontFamily="Segoi UI" Foreground="White" Width="200"  Height="120" />
            <TextBlock Text="T1 °C" TextWrapping="WrapWholeWords" Margin="100 100 45 10"  FontSize="50" FontFamily="Segoi UI" Foreground="White" Width="55"  Height="120" />
            <TextBlock x:Name="Sonda_2" TextWrapping="WrapWholeWords" Margin="90 91 -90 10"  FontSize="120" FontFamily="Segoi UI" Foreground="White" Width="200"  Height="120" />
            <TextBlock Text="T2 °C" TextWrapping="WrapWholeWords" Margin="100 100 45 10"  FontSize="50" FontFamily="Segoi UI" Foreground="White" Width="55"  Height="120" />
        </GridView>
        <GridView>
            <TextBlock x:Name="Sonda_3" TextWrapping="WrapWholeWords" Margin="90 91 -90 10"  FontSize="120" FontFamily="Segoi UI" Foreground="White" Width="200"  Height="120" />
            <TextBlock Text="T3 °C" TextWrapping="WrapWholeWords" Margin="100 100 45 10"  FontSize="50" FontFamily="Segoi UI" Foreground="White" Width="55"  Height="120" />
            <TextBlock x:Name="Sonda_4" TextWrapping="WrapWholeWords" Margin="90 91 -90 10"  FontSize="120" FontFamily="Segoi UI" Foreground="White" Width="200"  Height="120" />
            <TextBlock Text="T4 °C" TextWrapping="WrapWholeWords" Margin="100 100 45 10"  FontSize="50" FontFamily="Segoi UI" Foreground="White" Width="55"  Height="120" />
        </GridView>

    </StackPanel>

    <!-- Sezione Pulsanti -->
    <StackPanel  Grid.Row="1">
        <GridView>
           ...

        </GridView>

    </StackPanel>
    <StackPanel Grid.Column="1" Grid.Row="1">
        <GridView>

            ....

        </GridView>

    </StackPanel>


    <!-- Sezione Loghi -->
    <StackPanel Grid.Row="2">
        ...
    </StackPanel>
    <StackPanel Grid.Row="2" Grid.Column="1">

       ...

    </StackPanel>

</Grid>
</Viewbox>

Hope this helps:)