Question

我希望能够允许我的应用程序中的按钮始终保持直立状态，即使设备顺时针或逆时针旋转也是如此。标准应用程序栏可以根据设备处于纵向还是横向模式调整应用程序栏图标，因此我想通过页面上的按钮执行类似操作。我怎么能这样做？任何建议进入方法？我想要坚持应用程序栏已经做的事情，或者总是旋转按钮使其在设备旋转时保持直立。

<Button x:Name="CameraButton" Grid.Row="1" Grid.Column="0" Margin="-48,0,0,-12"
                        Click="CameraButton_Click">
                    <Button.Content>
                        <Image Source="/Assets/Camera_Button1.png"/>
                    </Button.Content>
                </Button>

Answer 1

如果您不关心系统自动播放的旋转动画，您可以通过提供3个不同的图标（Portrait，LandscapeLeft，LandscapeRight）轻松实现。

在Xaml中，首先将ApplicationBarIconButton添加到页面Resource中，然后在触发OrientationChanged时更改其IconUri。希望它有所帮助。

项目代码可以在这里下载： http://hdtp.synology.me/ApplicationBarIconDirection.zip

xaml代码：

<phone:PhoneApplicationPage 
x:Class="ApplicationBarIconDirection.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
shell:SystemTray.IsVisible="True"
OrientationChanged="PhoneApplicationPage_OrientationChanged">

<phone:PhoneApplicationPage.Resources>
    <shell:ApplicationBarIconButton x:Key="icon_arrow" IconUri="/Assets/up.png" Text="FixedUp"/>
</phone:PhoneApplicationPage.Resources>

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
</Grid>

<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>

xaml.cs代码：

    using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.Windows.Navigation;
using Microsoft.Phone.Shell;

namespace ApplicationBarIconDirection
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            this.ApplicationBar.Buttons.Add(this.Resources["icon_arrow"] as ApplicationBarIconButton);
        }

        private void PhoneApplicationPage_OrientationChanged(object sender, OrientationChangedEventArgs e)
        {
            if (e.Orientation == PageOrientation.LandscapeLeft)
            {
                (this.Resources["icon_arrow"] as ApplicationBarIconButton).IconUri = new Uri("/Assets/left.png", UriKind.Relative);
            }
            else if (e.Orientation == PageOrientation.LandscapeRight)
            {
                (this.Resources["icon_arrow"] as ApplicationBarIconButton).IconUri = new Uri("/Assets/right.png", UriKind.Relative);
            }
            else
            {
                (this.Resources["icon_arrow"] as ApplicationBarIconButton).IconUri = new Uri("/Assets/up.png", UriKind.Relative);
            }
        }
    }
}

Answer 2

Application Bar有一个名为SupportedOrientation的属性，每次手机的方向发生变化时都会更改其方向（请参阅this）。但是，如果我们查看按钮，那么我们看到既没有名为SupportedOrientation的属性，也没有任何其他属性与应用程序栏的SupportedOrientation类似。因此，我建议您根据手机方向的变化制作自己的逻辑。

改变方向的示例逻辑 -

旋转按钮的逻辑

CompositeTransform ct=new CompositeTransform (){Rotation=90};
               button.Rendertransform=ct;

将此应用于此方向更改

private void PhoneApplicationPage_OrientationChanged(object sender, OrientationChangedEventArgs e)
        {
            if (e.Orientation == PageOrientation.LandscapeLeft)
            {
              //apply rotation with some angle say 90
            }
            else if (e.Orientation == PageOrientation.LandscapeRight)
            {
              //apply rotation 180
            }
            else if(e.Orientation == PageOrientation.PortraitUp)
            {
              //apply rotation  270
            } 
            else if(e.Orientation == PageOrientation.PortraitDown)
            {
              //apply rotation 360
            }
        }

对于像应用程序栏按钮那样的平滑性，您必须使用表达式混合使用故事板和动画来弄脏手

设备位置更改时如何保持按钮竖直

2 个答案: