有没有办法显示向上滑动面板，当用户将其滑动时显示更多数据？

Question

我希望能够在面板上上下滑动以查看图像中显示的更多数据。更喜欢跨平台解决方案。我曾尝试使用SlideOverKit，但它似乎没有这种能力 - 或者我可能是错的？对于这种情况，会有更好的解决方案吗？

Answer 1

有很多方法可以实现滑动面板，这是在绝对布局上使用PanGestureRecognizer进行滑动上/下的方法：

<AbsoluteLayout BackgroundColor="Silver" AbsoluteLayout.LayoutBounds="0,1,1,1">
<!--        
    Your page's content here
-->
    <StackLayout x:Name="bottomDrawer" BackgroundColor="Olive" AbsoluteLayout.LayoutBounds="0.5,1.00,0.9,0.04" AbsoluteLayout.LayoutFlags="All">
        <StackLayout.GestureRecognizers>
            <PanGestureRecognizer PanUpdated="PanGestureHandler" />
        </StackLayout.GestureRecognizers>
<!--        
    Your sliding panel's content here
-->
        <Label x:Name="swipeLabel" Text="Swipe me up" TextColor="Black" HorizontalOptions="Center" />
        <Button Text="Click Me" BackgroundColor="Silver" TextColor="Black" BorderColor="Gray" BorderWidth="5" BorderRadius="20" />
        <Image Source="whome" />
    </StackLayout>
</AbsoluteLayout>

PanGestureRecognizer处理程序：

double? layoutHeight;
double layoutBoundsHeight;
int direction;
const double layoutPropHeightMax = 0.75;
const double layoutPropHeightMin = 0.04;
void PanGestureHandler(object sender, PanUpdatedEventArgs e)
{
    layoutHeight = layoutHeight ?? ((sender as StackLayout).Parent as AbsoluteLayout).Height;
    switch (e.StatusType)
    {
        case GestureStatus.Started:
            layoutBoundsHeight = AbsoluteLayout.GetLayoutBounds(sender as StackLayout).Height;
            break;
        case GestureStatus.Running:
            direction = e.TotalY < 0 ? 1 : -1;
            break;
        case GestureStatus.Completed:
            if (direction > 0) // snap to max/min, you could use an animation....
            {
                AbsoluteLayout.SetLayoutBounds(bottomDrawer, new Rectangle(0.5, 1.00, 0.9, layoutPropHeightMax));
                swipeLabel.Text = "Swipe me down";
            }
            else
            {
                AbsoluteLayout.SetLayoutBounds(bottomDrawer, new Rectangle(0.5, 1.00, 0.9, layoutPropHeightMin));
                swipeLabel.Text = "Swipe me up";
            }
            break;
    }
}

您可以通过设置＆＃34;面板＆＃34;添加拖动到平移手势。 GestureStatus.Running案例陈述中的大小。类似的东西会让你开始：

case GestureStatus.Running:
    direction = e.TotalY < 0 ? 1 : -1;
    var yProp = layoutBoundsHeight + (-e.TotalY / (double)layoutHeight);
    if ((yProp > layoutPropHeightMin) & (yProp < layoutPropHeightMax))
        AbsoluteLayout.SetLayoutBounds(bottomDrawer, new Rectangle(0.5, 1.00, 0.9, yProp));
    break;

注意：就个人而言，我会将这种拖动方式用作原型，因为它很糟糕。我会为每个平台编写一个自定义渲染器以避免使用Forms＆＃39;布局经理。