CODEWITHSUNDEEP
c#user-controlswindows-phone-8.1uwpuwp-xaml
cybergogic
cybergogic

Reputation: 33

UserControl scaling Windows Phone 8.1

I created my own UserControl (customized loading animation) I want to scale all components inside of my usercontrol when i put my usercontrol to page. Usercontrol contains ellipses, rectangles and doubleanimation logic.

<UserControl
x:Class="UC_test"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:WP_Eq_App"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="200"
d:DesignWidth="200">

<Grid x:Name="mainGrid">
    <Grid.RowDefinitions>

        <RowDefinition Height="Auto" />
        <!--<<< Will resize to the size of contents -->

    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>

    </Grid.ColumnDefinitions>

    <Ellipse x:Name="MainEl" RenderTransformOrigin=".5,.5"  Fill="Transparent" HorizontalAlignment="Left" Height="150"  StrokeThickness="5"  Stroke="Black" VerticalAlignment="Top" Width="150" Margin="0,0,0,0"/>


</Grid>
</UserControl>

please help me for this simple example. Thank you.

Upvotes: 0

Views: 30

Answers (1)

Bart
Bart

Reputation: 10015

If you want content to automatically scale, you should put it in a ViewBox control.

<UserControl
x:Class="UC_test"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:WP_Eq_App"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="200"
d:DesignWidth="200">
    <ViewBox>
        <Ellipse x:Name="MainEl" RenderTransformOrigin=".5,.5"  Fill="Transparent" HorizontalAlignment="Left" Height="150"  StrokeThickness="5"  Stroke="Black" VerticalAlignment="Top" Width="150" Margin="0,0,0,0"/>
    </ViewBox>
</UserControl>

The ViewBox control can have 1 child, so if you want to put more controls in, wrap them in a Grid or StackPanel.

Upvotes: 1

Related Questions