locked
How to align a button in a stack panel

    Question

  • Hello,

    How do I align a textbox with a header and a button inside a stackpanel?

    Here's my code:

    <StackPanel Margin="150,50,50,50">
                <TextBlock FontSize="36" Text="Greetings" HorizontalAlignment="left" Style="{StaticResource TitleTextBlockStyle}"/>
                <StackPanel Orientation="Horizontal" Margin="0,20,0,20">
                    <TextBox x:Name="nameInput" Width="300" HorizontalAlignment="Left" Header="What is your name? "/>
                    <Button Content="Say &quot;Hello&quot;" Click="Button_Click"/>
                </StackPanel>
                <TextBlock x:Name="greetingOutput" FontSize="36" Style="{StaticResource BaseTextBlockStyle}"/>
    </StackPanel>

    I am just a beginner in XAML/C++ development in Windows Store Apps. Hoping for a quick help. Thank you.

    Regards,

    Raymart

    Tuesday, June 10, 2014 8:31 AM

Answers

  • Start using a grid and define columns and rows. getting this kind alignment working in a stackpanel will be a big mess

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    Tuesday, June 10, 2014 11:50 AM

All replies

  • Start using a grid and define columns and rows. getting this kind alignment working in a stackpanel will be a big mess

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    Tuesday, June 10, 2014 11:50 AM
  • Hi,

    Just like Dave says, you can use grid in stackpanel to set the controls postion in stackPanle. Or you can set margin property to change the button postion, see some codes below:

    <StackPanel Margin="150,50,50,50">
                <TextBlock FontSize="36" Text="Greetings" HorizontalAlignment="left" Style="{StaticResource TitleTextBlockStyle}"/>
                <StackPanel Orientation="Horizontal" Margin="0,20,0,20">
    
                    <TextBox x:Name="nameInput" Width="300" HorizontalAlignment="Left"  Grid.Column="0"  TextChanged="nameInput_TextChanged" Height="70" Grid.Row="0">
                        <TextBox.Header >
                            <TextBlock Text="What is your name? " Height="20"></TextBlock>
                        </TextBox.Header>
                    </TextBox>
                    <Button Content="Say &quot;Hello&quot;" Click="Button_Click" Margin="0,20,0,-10" Height="50"  />
                </StackPanel>
                <TextBlock x:Name="greetingOutput" FontSize="36" Style="{StaticResource BaseTextBlockStyle}"/>
            </StackPanel>

    And refer to the link:

    http://msdn.microsoft.com/en-us/library/windows/apps/xaml/windows.ui.xaml.frameworkelement.margin.aspx

    Best Wishes!


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey. Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Wednesday, June 11, 2014 2:40 AM