如何在Windows Phone 8.1的屏幕一角安排按钮?

时间:2015-11-21 11:08:12

标签: windows-phone-8 windows-phone-8.1

我开发的是Windows手机应用程序。但是4英寸分辨率设备的屏幕是完美的。但是5英寸或6英寸分辨率的设备设计并不完美。如何解决这个问题。

请在屏幕截图上方显示。enter image description here

在上面的屏幕中我希望设置按钮是屏幕的一角,在4英寸分辨率设备中排列完美。但是5英寸或6英寸设备按钮没有设置在屏幕的一角。它出现了。如何在屏幕的一角设置按钮。

下面是我的代码

     <Grid Style="{StaticResource LayoutGridStyle}">

        <Pivot  Title="RELOAD"  CommonNavigationTransitionInfo.IsStaggerElement="True" Style="{StaticResource CustomPivotStyle}" BorderBrush="{StaticResource PhoneAccentBrush}" >

            <Pivot.TitleTemplate>
                <DataTemplate>
                    <Grid Background="White">
                        <StackPanel Margin="0,0,0,10">
                            <Image Source="/Images/logo.png" Height="40" Margin="0,0,-362,0"/>
                        </StackPanel>

                    </Grid>
                </DataTemplate>
            </Pivot.TitleTemplate>
            <Pivot.HeaderTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}"  FontSize="25" />
                </DataTemplate>
            </Pivot.HeaderTemplate>
            <PivotItem Header="MOBILE" Margin="0,10,0,0.167">

                <StackPanel>

                    <Grid>
                        <Button x:Name="prepaidbtn" Content="PREPAID" HorizontalAlignment="Left" Foreground="White"  Background="#1e365a" Margin="0,5,0,1" RenderTransformOrigin="1.079,0.516" Click="prepaidbtn_Click" Width="118"></Button>
                        <Button x:Name="postpaidbtn" Content="POSTPAID" HorizontalAlignment="Right" Foreground="#A9A9A9"  Background="#1e365a" Margin="281,5,0,0" Click="postpaidbtn_Click" Height="57"/>
                    </Grid>
                    <Grid x:Name="gridprepaid" Height="437" >
                        <Grid>

                            <TextBox x:Name="rechargePhoneno"  MaxLength="10" PlaceholderText="Mobile Number" BorderBrush="#FFABAABF" Margin="10,10,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top" TextChanged="rechargePhoneno_TextChanged" InputScope="Number">
                            </TextBox>
                            <Button x:Name="Contactbtn" HorizontalAlignment="Right" Click="Contactbtn_Click" BorderThickness="0,0,0,0"  Margin="315,-9,-9,366"  Height="77">
                                <StackPanel>
                                    <Image Source="Images/n_contacts.9.png" Width="55" Height="38"/>
                                </StackPanel>
                            </Button>

                        </Grid>


                            <ComboBox  x:Name="rechargeOperator1"  BorderBrush="#FFABAABF" Margin="10,80,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top" PlaceholderText="Select Operator" RenderTransformOrigin="0.5,0.5" SelectionChanged="rechargeOperator1_SelectionChanged"  >

                            </ComboBox>


                            <ComboBox x:Name="rechargeCircles1" BorderBrush="#FFABAABF" Margin="10,160,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top" PlaceholderText="Select Circle" RenderTransformOrigin="0.5,0.5" SelectionChanged="rechargeCircles1_SelectionChanged">

                            </ComboBox>

                        <Grid x:Name="gridspecial" Visibility="Collapsed" >
                            <RadioButton x:Name="Topup" Content="Topup" FontSize="20" HorizontalAlignment="Left" Width="30" Margin="10,200,0,0" Foreground="#1e365a" Background="#1e365a" ></RadioButton>
                            <RadioButton x:Name="special" Content="Special" FontSize="20" HorizontalAlignment="Right" Margin="0,200,10,0" Foreground="#1e365a"  Background="#1e365a" ></RadioButton>
                        </Grid>
                        <Grid >
                            <TextBox x:Name="txtamount" MaxLength="4"   PlaceholderText="Amount" InputScope="Number"  RenderTransformOrigin="0.5,0.5" BorderBrush="#FFABAABF" Margin="10,251,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top"/>
                            <Button x:Name="plansbtn"  Content="Browse Plans" RenderTransformOrigin="0.522,-0.018" Height="37" Foreground="#1e365a" Width="181"  Click="plansbtn_Click" Margin="231,253,-12,123" FontSize="20" Background="{x:Null}" BorderBrush="{x:Null}" HorizontalAlignment="Right"/>
                        </Grid>

                            <Button x:Name="Recharge" Content="RECHARGE" Background="Red" Foreground="White" HorizontalAlignment="Stretch" Margin="10,0,0,42" RenderTransformOrigin="0.514,1.408"  VerticalAlignment="Bottom" Height="70" Click="Recharge_Click" FontWeight="Bold" FontSize="25">

                            </Button>



                        <Button  VerticalAlignment="Bottom" HorizontalAlignment="Right"  Height="97" BorderThickness="0" Margin="331,0,-40,-62" >
                            <StackPanel>
                                <Image Source="Images/ic_navigation_drawer.png" Stretch="Fill" Width="59" Height="39"  />
                            </StackPanel>
                            <Button.Flyout>
                                <MenuFlyout>
                                    <MenuFlyoutItem x:Name="reloadcash" Text="Reloadcash" Click="reloadcash_Click" />
                                    <MenuFlyoutItem x:Name="prevoiusorders" Text="Previous orders" Click="prevoiusorders_Click"/>
                                    <MenuFlyoutItem x:Name="profile" Text="profile" Click="profile_Click"/>
                                    <MenuFlyoutItem x:Name="changepassword" Text="changepassword" Click="changepassword_Click"/>
                                    <MenuFlyoutItem x:Name="Contacts" Text="Contacts" Click="Contacts_Click"/>
                                    <MenuFlyoutItem x:Name="busorderhistory" Text="Busorderhistory" Click="busorderhistory_Click"></MenuFlyoutItem>

                                </MenuFlyout>
                            </Button.Flyout>
                        </Button>
                    </Grid>

                    <Grid x:Name="gridpoastpaid"  Visibility="Collapsed">
                        <Grid>

                            <TextBox x:Name="rechargePhonenopostpaid" MaxLength="10" PlaceholderText="Postpaid Mobile Number" BorderBrush="#FFABAABF" Margin="10,10,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top"  InputScope="Number" RenderTransformOrigin="0.5,0.5"  TextChanged="rechargePhonenopostpaid_TextChanged"  />
                            <Button x:Name="Contactbtn1" Click="Contactbtn_Click" BorderThickness="0"  Margin="315,-9,-9,366" Width="102" Height="77" HorizontalAlignment="Right">
                                <StackPanel>
                                    <Image Source="Images/n_contacts.9.png"  Width="55" Height="38"/>
                                </StackPanel>
                            </Button>
                        </Grid>
                        <Grid>

                            <ComboBox  x:Name="rechargeOperator1postpaid"   PlaceholderText="Operator" SelectionChanged="rechargeOperator1postpaid_SelectionChanged" BorderBrush="#FFABAABF" Margin="10,80,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top"  />

                        </Grid>


                        <Grid>
                            <TextBox x:Name="txtamountpostpaid"  MaxLength="4" PlaceholderText="Amount" InputScope="Number" BorderBrush="#FFABAABF" Margin="10,160,10,0" Height="44" BorderThickness="0,0,0,2" VerticalAlignment="Top"  />

                        </Grid>
                        <Grid >
                            <Button x:Name="pay" Content="PAY" Background="Red" Foreground="White" HorizontalAlignment="Stretch" Margin="0,240,0,123" FontSize="25" FontWeight="Bold" Height="70" Click="pay_Click"/>
                        </Grid>
                        <Button  VerticalAlignment="Bottom" HorizontalAlignment="Right"  Height="106" BorderThickness="0" Width="74" Margin="0,392,-32,-65" >
                            <StackPanel>
                                <Image Source="Images/ic_navigation_drawer.png" Stretch="Fill" Width="70" Height="37"  />
                            </StackPanel>
                            <Button.Flyout>
                                <MenuFlyout>
                                    <MenuFlyoutItem x:Name="reloadcash6" Text="Reloadcash" Click="reloadcash_Click" />
                                    <MenuFlyoutItem x:Name="prevoiusorders6" Text="Previous orders" Click="prevoiusorders_Click"/>
                                    <MenuFlyoutItem x:Name="profile6" Text="profile" Click="profile_Click"/>
                                    <MenuFlyoutItem x:Name="changepassword6" Text="changepassword" Click="changepassword_Click"/>
                                    <MenuFlyoutItem x:Name="Contacts6" Text="Contacts" Click="Contacts_Click"/>
                                    <MenuFlyoutItem x:Name="busorderhistory6" Text="Busorderhistory" Click="busorderhistory_Click"></MenuFlyoutItem>


                                </MenuFlyout>
                            </Button.Flyout>
                        </Button>
                    </Grid>

                </StackPanel>

            </PivotItem>
 </Pivot>
    </Grid>

所需按钮位于充电按钮下方。

1 个答案:

答案 0 :(得分:1)

试试这段代码

    <Button  VerticalAlignment="Bottom" HorizontalAlignment="Right"   BorderThickness="0"  >
                        <!--<StackPanel>
                            <Image Source="Assets/SmallLogo.png" Stretch="Fill" Width="59" Height="39"  />
                        </StackPanel>-->
                        <Button.Background>
                            <ImageBrush ImageSource="Assets/SmallLogo.png"/>
                        </Button.Background>
                        <Button.Flyout>
                            <MenuFlyout>
                                <MenuFlyoutItem x:Name="reloadcash" Text="Reloadcash" Click="reloadcash_Click" />
                                <MenuFlyoutItem x:Name="prevoiusorders" Text="Previous orders" Click="prevoiusorders_Click"/>
                                <MenuFlyoutItem x:Name="profile" Text="profile" Click="profile_Click"/>
                                <MenuFlyoutItem x:Name="changepassword" Text="changepassword" Click="changepassword_Click"/>
                                <MenuFlyoutItem x:Name="Contacts" Text="Contacts" Click="Contacts_Click"/>
                                <MenuFlyoutItem x:Name="busorderhistory" Text="Busorderhistory" Click="busorderhistory_Click"></MenuFlyoutItem>

                            </MenuFlyout>
                        </Button.Flyout>
                    </Button>