CODEWITHSUNDEEP
wpfxaml
ADi
ADi

Reputation: 219

control not positioning right

I wantto postion control like this pic enter image description here

I need Next and previous buttons to be as pic 1, but i get the following, and not able to solve this. enter image description here

Please guide, XAML code:

<StackPanel Grid.Row="4">
        <Grid x:Name="GridNavigation">
            <Button x:Name="Gridprevbutton" Content="Previous" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="121,0,0,0"></Button>
            <Button x:Name="Gridnextbutton" Content="Next" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="231 , 0, 0, 0"></Button>
            <Button x:Name="Gridendexambuton" Content="End Exam" VerticalAlignment="Top" HorizontalAlignment="Right" Margin="0,0,5,0"></Button>
        </Grid>
        <TextBlock HorizontalAlignment="Right" Margin="0,5,10,0" TextDecorations="Underline">Contact Support</TextBlock>
</StackPanel>

(Edit) I end up doing this following @davisoa advise. and got it working.

Code behind

private void SetNavigation()
{
    var img = Common.AddImageToContainer("images/lowerleftblock.png", GridNavigation, Common.ToDictionaryTLST("top", "left", "none"));
        img.Margin = new Thickness(0,16,0,0);
        Panel.SetZIndex(img, -1);       
}

Upvotes: 0

Views: 53

Answers (2)

davisoa
davisoa

Reputation: 5439

It looks to me like the Grid you are not showing above (the first StackPanel is in Grid.Row="4") is limiting the height of your Next and Previous buttons.

This example XAML shows the Question block lower than the buttons.

  • Changed Image to a StackPanel with a Label, since I don't have your image
  • Changed VerticalAlignment to Bottom, to ensure it floats on the bottom of the Grid
  • Gave the Grid a fixed Height to ensure the vertical layout is correct. You probably don't want to do this
<StackPanel Grid.Row="4">
    <Grid x:Name="GridNavigation" Margin="0,0,0,0" Height="75">
        <StackPanel x:Name="Lowerleftblock" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="0,0,0,0" Background="Green">
          <Label>Question: 1 of 27</Label>
        </StackPanel>
        <Button x:Name="Gridprevbutton" Content="Previous" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="121,0,0,0"></Button>
        <Button x:Name="Gridnextbutton" Content="Next" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="231 , 0, 0, 0"></Button>
        <Button x:Name="Gridendexambuton" Content="End Exam" VerticalAlignment="Top" HorizontalAlignment="Right" Margin="0,0,5,0"></Button>
    </Grid>
    <TextBlock HorizontalAlignment="Right" Margin="0,5,10,0" TextDecorations="Underline">Contact Support</TextBlock>
</StackPanel>

Upvotes: 1

Mashton
Mashton

Reputation: 6415

Give your image a top margin to bring it down by however much is needed. E.g.

<Image x:Name="Lowerleftblock" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0,20,0,0"></Image>

Upvotes: 1

Related Questions