Search code examples
c#xamluwptemplate10

Many template10 resizer on same page


I use template10 library on my uwp application.
I tried to put 4 resizer control on textbox on the same page.
But when i drag one, grabbers of others textboxes are also moving without the textbox.

What i want is :

  • if i grab one grabber, only this grabber is supposed to move
  • the others are not supposed to move together

Do you have any idea ?

enter image description here

Here is my code :

<StackPanel x:Name="MedicalInfoGroup" Margin="0,0,0,24">

    <controls:Resizer Margin="0,0,0,24">
        <TextBox    TextWrapping="Wrap"
                    AcceptsReturn="True"
                    MinWidth="500" MinHeight="100"
                    Text="{Binding MedicalInformationsItem.Treatment, Mode=TwoWay}"
                    HorizontalAlignment="Left"
                    InputScope="Default"
                    IsSpellCheckEnabled="True">
        </TextBox>
    </controls:Resizer>

    <controls:Resizer Margin="0,0,0,24">
        <TextBox    TextWrapping="Wrap"
                    AcceptsReturn="True"
                    MinWidth="500" MinHeight="100"
                    Text="{Binding MedicalInformationsItem.MedicalHistory, Mode=TwoWay}"
                    HorizontalAlignment="Left"
                    InputScope="Default"
                    IsSpellCheckEnabled="True">
        </TextBox>
    </controls:Resizer>

    <controls:Resizer Margin="0,0,0,24">
        <TextBox    TextWrapping="Wrap"
                    AcceptsReturn="True"
                    MinWidth="500" MinHeight="100"
                    Text="{Binding MedicalInformationsItem.SurgicalHistory, Mode=TwoWay}"
                    HorizontalAlignment="Left"
                    InputScope="Default"
                    IsSpellCheckEnabled="True">
        </TextBox>
    </controls:Resizer>

    <controls:Resizer Margin="0,0,0,24">
        <TextBox    TextWrapping="Wrap"
                    AcceptsReturn="True"
                    MinWidth="500" MinHeight="100"
                    Text="{Binding MedicalInformationsItem.Allergies, Mode=TwoWay}"
                    HorizontalAlignment="Left"
                    InputScope="Default"
                    IsSpellCheckEnabled="True">
        </TextBox>
    </controls:Resizer>

</StackPanel>

Solution

  • Try setting the HorizontalAlignment of the Resizer to Left instead of the TextBox

    <controls:Resizer Margin="0,0,0,24"
                      HorizontalAlignment="Left">
        <TextBox TextWrapping="Wrap"
                 AcceptsReturn="True"
                 MinWidth="500" MinHeight="100"
                 Text="{Binding MedicalInformationsItem.Treatment, Mode=TwoWay}"
                 InputScope="Default"
                 IsSpellCheckEnabled="True">
        </TextBox>
    </controls:Resizer>