誰能幫我解決這個問題？ 我的任務是在Xamarin Forms中重現上述例子，這是一個靈活的、可拆卸的UI表單，用于用MVVM輸入資料，我需要幫助來實作這一目標。我將感謝你的合作。
uj5u.com熱心網友回復：
我建議看一下這個：
https://github.com/sthewissen/Xamarin.Forms.PancakeView然后你可以在PancakeView上使用TapGestureRecognizer（https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/gestures/tap），以編程方式對其高度進行影片處理，請看這個（這是針對BoxView的，但代碼應該是類似的）：
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/gestures/tap
要實作你提供的例子，只需在PancakeView內添加一個ListView，并將其與你的資料系結--我猜你知道如何做，因為你提到你知道如何實作MVVM。
uj5u.com熱心網友回復：
撇開格式和風格不談，我建議你應該看看手勢識別器來移動國家的串列。
- 如果用戶必須向上拖動串列，那么您可以考慮使用PanGestureRecognizer . 。
- 如果用戶要向上滑動，觸發串列的影片運動，那么可以看看SwipeGestureRecognizer和TranslateTo影片。
uj5u.com熱心網友回復：
你可以用一個框架來模擬你截圖中的底片。你可以看看下面的代碼。
<RelativeLayout>/span>
<StackLayout Padding="10,20,0,0"/span>>
<Label Text="Page7"/span> />
</StackLayout>
<Frame
x:Name="bottomSheet"。
Padding="1,4,1,0"
BackgroundColor="#faf9f8"
CornerRadius="8"
HasShadow="true"/span>
RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Height,
Factor=1,
Constant=0}"
RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Width,
Factor=1,
Constant=0}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Height,
Factor=.9,
Constant=0}">
<Frame.GestureRecognizers>
<PanGestureRecognizer PanUpdated="OnPanUpdated"/span> />
</Frame.GestureRecognizers>
<StackLayout Spacing="5"/span>>
<BoxView>
BackgroundColor="Gray"/span>
CornerRadius="2"/span>
HeightRequest="5"/span>
HorizontalOptions="Center"/span>
WidthRequest="50"/span> />
<SearchBar
x:Name="SearchBox"/span>
BackgroundColor="Transparent"
Focused="SearchBar_Focused"。
Placeholder="Search by Ingredient"。
/>
<StackLayout x:Name="GridFilter"/span>>
<Button />
</StackLayout>/span>
</StackLayout>/span>
</Frame>/span>
</RelativeLayout>/span>
后面的代碼：
public Page7()
{
InitializeComponent();
}
public double getProportionCoordinate(double proportion)
{
回傳比例*高度。
}
private void SearchBar_Focused(object sender, FocusEventArgs e)
{
GridFilter.IsVisible = true;
openBottomSheet();
}
void openBottomSheet()
{
var finalTranslation = Math.Max(Math.Min(0, -1000), -Math.Abs(getProportionCoordinate(.85))。
bottomSheet.TranslateTo（bottomSheet.X, finalTranslation, 150, Easing.SpringIn）。
}
// 重要代碼在下面
double x, y;
private void OnPanUpdated(object sender, PanUpdatedEventArgs e)
{
// 處理平移
switch (e.StatusType)
{
case GestureStatus.Running:
// 平移并確保我們不會讓y e.TotalY平移到被包裹的用戶界面元素的邊界之外。
var translateY = Math.Max(Math.Min(0, y e.TotalY), -Math.Abs((Height * .25) - Height))。
bottomSheet.TranslateTo（bottomSheet.X, translateY, 20）。
突破。
case GestureStatus.Completed:
//存盤平移程序中應用的翻譯
y = bottomSheet.TranslationY;
//在事件結束時--快照到最近的位置
var finalTranslation = Math.Max(Math.Min(0, -1000), -Math.Abs(getClosestLockState(e.TotalY y)) )。
//取決于向上或向下滑動--改變搶拍的影片
如果(isSwipeUp(e))
{
bottomSheet.TranslateTo（bottomSheet.X, finalTranslation, 250, Easing.SpringIn）。
}
否則
{
bottomSheet.TranslateTo(bottomSheet.X, finalTranslation, 250, Easing.SpringOut)。
}
//在轉換后取消鍵盤
SearchBox.Unfocus();
y = bottomSheet.TranslationY;
休息。
}
}
public bool isSwipeUp(PanUpdatedEventArgs e)
{
如果(e.TotalY < 0)
{
回傳true。
}
return false;
}
//要做的事：使之更簡潔
public double getClosestLockState(double TranslationY)
{
//用這些值來調整鎖定動作--這將根據apge上的內容數量而變化
var lockStates = new double[] { 0, .5, .85 };
//獲取當前頁面與螢屏的比例
var distance = Math.Abs(TranslationY);
var currentProportion = distance / Height;
//計算它最接近哪個鎖定狀態
var smallestDistance = 10000.0;
var closestIndex = 0;
for (var i = 0; i < lockStates.Length; i )
{
var state = lockStates[i];
var absoluteDistance = Math.Abs(state - currentProportion);
如果(absoluteDistance < smallestDistance)
{
最小的距離 = 絕對距離。
最接近的Index = i;
}
}
var selectedLockState = lockStates[closestIndex];
var TranslateToLockState = getProportionCoordinate(selectedLockState);
回傳TranslateToLockState。
}
關于資料系結的更多細節，你可以參考MS的檔案。 https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/data-binding/
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/312686.html
標籤：