silverlight   发布时间:2022-05-03  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了Silverlight – 如何在WP7上实现相机应用程序样式照片条?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

概述

我遇到了许多问题,造成与Camera应用程序中相片非常相似的效果. 我想做的是显示一个网格,每个网格具有与屏幕相同的尺寸(无论是纵向还是横向).已经,我不得不做一些黑客和create dependency properties that the grids width and height properties bind to维持长宽比. 这工作正常.但是当我为我的条形图创建一个StackPane
我遇到了许多问题,造成与Camera应用程序中相片非常相似的效果.

我想做的是显示一个网格,每个网格具有与屏幕相同的尺寸(无论是纵向还是横向).已经,我不得不做一些黑客和create dependency properties that the grids width and height properties bind to维持长宽比.

这工作正常.但是当我为我的条形图创建一个StackPanel并实现我的导航(或者只是使用z-index变换缩放),我看到我的StackPanel不能显示大于屏幕尺寸(它被裁剪成只有一个网格的大小) .我以我找一个描述这个问题的帖子,但是现在找不到 – 如果你知道我正在虑哪个帖子,或者如果你更多地了解这个限制,请发贴.

我发现唯一的解决方法是使用ScrollViewer,这绝对不是我想要的行为,但它允许StackPanel比屏幕更宽.

我的真正问题是ScrollViewer的行为 – 因为我需要从网格跳转到网格(就像照片条)而不是自由滚动,只要我能告诉Horizo​​ntalOffset不是一个动画的属性.我可以通过每15毫秒调用ScrollToHorizo​​ntalOffset强制它来动画,基本上是手动实现我自己的缓动效果.这似乎是一个巨大的黑客,而且这个行为是非常诡异的(或者我每次看到它都不会得到ManipulationCompleted事件) – 在每次刷卡动作结束时 – 或者内置的ScrollViewer惯性物理干扰我的效果).

有没有人知道我遇到的问题的更好的解决方法,或者完全不同的方式来获取Silverlight中相机照片条的体验?

我已经虑过使用数据透视控件,但是它不是我想要的(如果我想让每个项目在下一个进入之前完全动画化,而不是显示为全部附加到一个条上,那么应该有更少的约束实现方式).更重要的是,该条只是我想要动态执行的许多效果之一.我想要一个CoolIris般的3D倾斜,或FliPPAD风格的页面转动.我相信如果我可以让我目前的设置工作很好,这将很容易实现这些其他的效果(作为可选的转换).承诺像Pivot这样的控制不会让我更接近这个愿景.

这是我的XAML:

<Grid x:Name="LayoutRoot" BACkground="Transparent" Height="{Binding RealHeight,ElementName=phoneApplicationPagE}" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" HorizontalAlignment="Left" VerticalAlignment="Top">
        <ScrollViewer x:Name="SlideScroller" VerticalScrollBarVisibility="Disabled" Height="{Binding RealHeight,ElementName=phoneApplicationPagE}" Margin="0,-31" ScrollViewer.HorizontalScrollBarVisibility="Auto" HorizontalAlignment="Left" VerticalAlignment="Top">
            <StackPanel x:Name="SlidePanel" Orientation="Horizontal" Height="{Binding RealHeight,ElementName=phoneApplicationPagE}" VerticalAlignment="Top" HorizontalAlignment="Left">    
                <Grid x:Name="Slide0" Margin="0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" Height="{Binding RealHeight,ElementName=phoneApplicationPagE}" BACkground="#FFCCCCCC">
                    <Image x:Name="Photo0" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" VerticalAlignment="Top" HorizontalAlignment="Left" Stretch="UniformToFill"/>
                </Grid>
                <Grid x:Name="Slide1" Margin="0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" BACkground="#FFCCCCCC">
                    <Image x:Name="Photo1" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" VerticalAlignment="Top" HorizontalAlignment="Left" Stretch="UniformToFill"/>
                </Grid>
                <Grid x:Name="Slide2" Margin="0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" BACkground="#FFCCCCCC">
                    <Image x:Name="Photo2" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" VerticalAlignment="Top" HorizontalAlignment="Left" Stretch="UniformToFill"/>
                </Grid>
            </StackPanel>    
        </ScrollViewer>
    </Grid>@H_618_36@

解决方法

事实证明,如果我只是阻止ScrollViewer被用户直接操纵并手动定位,我所描述的设置很好.这消除了我提到的造成大部分毛刺的物理效应.

XAML

<ScrollViewer x:Name="SlideScroller" VerticalScrollBarVisibility="Disabled" Height="{Binding RealHeight,ElementName=phoneApplicationPagE}" ScrollViewer.HorizontalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Visible" HorizontalAlignment="Left" VerticalAlignment="Top">
            <StackPanel x:Name="SlidePanel" Orientation="Horizontal" Height="{Binding RealHeight,ElementName=phoneApplicationPagE}" VerticalAlignment="Top" HorizontalAlignment="Left">
            </StackPanel>
        </ScrollViewer>
<Rectangle x:Name="ScrollInterceptRect" Margin="0,-31" Width="{Binding RealWidth,ElementName=phoneApplicationPagE}" HorizontalAlignment="Left" VerticalAlignment="Top">@H_618_36@ 
 

代码隐藏

public MainPage()
    {
        InitializeComponent();

        ScrollInterceptRect.MouSELEftButtonUp += new MouseButtonEventHandler(ScrollInterceptRect_MouSELEftButtonUp);
        ScrollInterceptRect.MouSELEftButtonDown += new MouseButtonEventHandler(ScrollInterceptRect_MouSELEftButtonDown);
        ScrollInterceptRect.MouseMove += new MouseEventHandler(ScrollInterceptRect_MouseMovE);
    }
    //...
    NavigationInDices navigationInDices = new NavigationInDices();
    readonly double swipeThreshold = 80.0;
    SwipeDirection swipeDirection;
    bool tapCancelled;
    Point swipeDelta;
    Point swipeStartPosition;
    double startScrollOffsetX;
    void SlideScroller_MouSELEftButtonDown(object sender,MouseButtonEventArgs E)
    {
        swipeStartPosition = e.GetPosition(this);
        startScrollOffsetX = SlideScroller.HorizontalOffset;
    }
    void ScrollInterceptRect_MouseMove(object sender,MouseEventArgs E)
    {
        Point touchPosition = e.GetPosition(this);
        swipeDelta = new Point() { X = swipeStartPosition.X - touchPosition.X,Y = swipeStartPosition.Y - touchPosition.Y };
        SlideScroller.ScrollToHorizontalOffset(startScrollOffsetX + swipeDelta.X);
        // swipe right
        if (swipeDelta.X > swipeThreshold)
        {
            swipeDirection = SwipeDirection.Left;
            tapCancelled = true;
        }
        // swipe left
        else if (swipeDelta.X < -swipeThreshold)
        {
            swipeDirection = SwipeDirection.Right;
            tapCancelled = true;
        }
    }
    void ScrollInterceptRect_MouSELEftButtonUp(object sender,MouseButtonEventArgs E)
    {
        if (swipeDirection == SwipeDirection.Left && navigationInDices.X < photos.Count - 1 && photos[navigationInDices.X] != null)
        {
            navigationInDices.X++;
        }
        // only go BACk when you aren't already at the beginning
        else if (swipeDirection == SwipeDirection.Right && navigationInDices.X > 0)
        {
            navigationInDices.X--;
        }
        if (!tapCancelled)
        {
            // handle tap
        }
        else
        {
            animateScrollViewerToCurrentPhoto();
        }
    }@H_618_36@ 
 

这简化了一点清晰度(我也使用垂直滑动在我的应用程序中的东西,我省略了我如何动画的ScrollViewer – 可能值得自己的帖子).

我很乐意听到您可以提供的任何改进,或建议更好的方法来实现它.也许扩展面板类或作为自定义行为.思

大佬总结

以上是大佬教程为你收集整理的Silverlight – 如何在WP7上实现相机应用程序样式照片条?全部内容,希望文章能够帮你解决Silverlight – 如何在WP7上实现相机应用程序样式照片条?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。