**SwipeTrap** A SwipeTrap is a component that traps swipe actions and triggers corresponding events.
**Basic**:
private bool isTriggeredBasic;
BitSwipeTrapEventArgs? swipeTrapEventArgsBasic;
BitSwipeTrapTriggerArgs? swipeTrapTriggerArgsBasic;
private void HandleOnStartBasic(BitSwipeTrapEventArgs args)
{
swipeTrapEventArgsBasic = args;
}
private void HandleOnMoveBasic(BitSwipeTrapEventArgs args)
{
swipeTrapEventArgsBasic = args;
}
private void HandleOnEndBasic(BitSwipeTrapEventArgs args)
{
swipeTrapEventArgsBasic = args;
}
private void HandleOnTriggerBasic(BitSwipeTrapTriggerArgs args)
{
isTriggeredBasic = true;
swipeTrapTriggerArgsBasic = args;
_ = Task.Delay(2000).ContinueWith(_ =>
{
isTriggeredBasic = false;
swipeTrapEventArgsBasic = null;
swipeTrapTriggerArgsBasic = null;
InvokeAsync(StateHasChanged);
});
}
**Panel**:
private decimal diffXPanel;
private bool isPanelOpen;
private void OpenPanel()
{
isPanelOpen = true;
}
private void ClosePanel()
{
isPanelOpen = false;
}
private void HandleOnMovePanel(BitSwipeTrapEventArgs args)
{
diffXPanel = args.DiffX;
}
private void HandleOnEndPanel(BitSwipeTrapEventArgs args)
{
diffXPanel = 0;
}
private void HandleOnTriggerPanel(BitSwipeTrapTriggerArgs args)
{
if (args.Direction == BitSwipeDirection.Left)
{
diffXPanel = 0;
ClosePanel();
}
}
private string GetPanelStyle()
{
return diffXPanel < 0 ? $"transform: translateX({diffXPanel}px)" : "";
}
**List**:
Reset
itemsList = Enumerable.Range(0, 10).ToList();
private decimal[] diffXList = Enumerable.Repeat(0m, 10).ToArray();
private void HandleOnMoveList(BitSwipeTrapEventArgs args, int index)
{
diffXList[index] = args.DiffX;
}
private void HandleOnEndList(BitSwipeTrapEventArgs args, int index)
{
if (diffXList[index] < 60)
{
diffXList[index] = 0;
}
}
private async Task HandleOnTriggerList(BitSwipeTrapTriggerArgs args, int index)
{
if (args.Direction == BitSwipeDirection.Right)
{
deletingIndex = index;
listTcs = new();
isListDialogOpen = true;
await listTcs.Task;
isListDialogOpen = false;
diffXList[index] = 0;
deletingIndex = -1;
}
}
private string GetRowStyle(int index)
{
var x = Math.Min(diffXList[index], 60);
return x > 0 ? $"transform: translateX({x}px)" : "";
}
private void HandleOnOkList()
{
if (deletingIndex != -1)
{
itemsList.Remove(deletingIndex);
}
listTcs.SetResult();
}
private void HandleOnCancelList()
{
listTcs.SetResult();
}
private void ResetList()
{
itemsList = Enumerable.Range(0, 10).ToList();
}
**Advanced**:
bit BlazorUI
Swipe left or right
private decimal? diffXPanelAdvanced;
private BitSwipeDirection? direction;
private BitSwipeDirection? panelOpen;
private void OpenPanelAdvanced(BitSwipeDirection swipeDirection)
{
if (panelOpen == swipeDirection) return;
direction = null;
panelOpen = swipeDirection;
diffXPanelAdvanced = 0;
}
private void ClosePanelAdvanced()
{
panelOpen = null;
diffXPanelAdvanced = null;
}
private void HandleOnMovePanelAdvanced(BitSwipeTrapEventArgs args)
{
diffXPanelAdvanced = args.DiffX;
if (Math.Abs(args.DiffX) > 2 || Math.Abs(args.DiffY) > 2)
{
direction = Math.Abs(args.DiffX) > Math.Abs(args.DiffY)
? args.DiffX > 0 ? BitSwipeDirection.Right : BitSwipeDirection.Left
: args.DiffY > 0 ? BitSwipeDirection.Bottom : BitSwipeDirection.Top;
}
else
{
direction = null;
}
}
private void HandleOnEndPanelAdvanced(BitSwipeTrapEventArgs args)
{
if (panelOpen.HasValue)
{
diffXPanelAdvanced = 0;
}
else
{
diffXPanelAdvanced = null;
}
}
private void HandleOnTriggerPanelAdvanced(BitSwipeTrapTriggerArgs args)
{
if (args.Direction == BitSwipeDirection.Left)
{
if (panelOpen.HasValue is false || panelOpen == BitSwipeDirection.Right)
{
OpenPanelAdvanced(BitSwipeDirection.Right);
}
else if (panelOpen == BitSwipeDirection.Left)
{
ClosePanelAdvanced();
}
}
else if (args.Direction == BitSwipeDirection.Right)
{
if (panelOpen.HasValue is false || panelOpen == BitSwipeDirection.Left)
{
OpenPanelAdvanced(BitSwipeDirection.Left);
}
else if (panelOpen == BitSwipeDirection.Right)
{
ClosePanelAdvanced();
}
}
}
private string GetLeftPanelAdvancedStyle()
{
if (panelOpen == BitSwipeDirection.Left && direction != BitSwipeDirection.Left)
{
return "transform: translateX(0px)";
}
else if((panelOpen.HasValue is false && direction == BitSwipeDirection.Right) || (panelOpen == BitSwipeDirection.Left && direction == BitSwipeDirection.Left))
{
return diffXPanelAdvanced switch
{
0 or > 200 => "transform: translateX(0px)",
< 0 and < 200 => $"transform: translateX({diffXPanelAdvanced}px)",
> 0 => $"transform: translateX(calc(-100% + {diffXPanelAdvanced}px))",
_ => string.Empty
};
}
return string.Empty;
}
private string GetRightPanelAdvancedStyle()
{
if (panelOpen == BitSwipeDirection.Right && direction != BitSwipeDirection.Right)
{
return "transform: translateX(0px)";
}
else if ((panelOpen.HasValue is false && direction == BitSwipeDirection.Left) || (panelOpen == BitSwipeDirection.Right && direction == BitSwipeDirection.Right))
{
return diffXPanelAdvanced switch
{
0 or < -200 => "transform: translateX(0px)",
> 0 => $"transform: translateX({diffXPanelAdvanced}px)",
< 0 => $"transform: translateX(calc(100% - {(-1 * diffXPanelAdvanced)}px))",
_ => string.Empty
};
}
return string.Empty;
}StartX: @swipeTrapEventArgs?.StartX
StartY: @swipeTrapEventArgs?.StartY
DiffX: @swipeTrapEventArgs?.DiffX
DiffY: @swipeTrapEventArgs?.DiffY
---
Triggered? @isTriggered
Trigger direction: @swipeTrapTriggerArgs?.Direction
Trigger diffX: @swipeTrapTriggerArgs?.DiffX
Trigger diffY: @swipeTrapTriggerArgs?.DiffY
Title
Item1
Item2
Item3
@foreach (int idx in itemsList)
{
var i = idx;
}
Delete
Item@(i + 1)
Left Menu
Item1
Item2
Item3
Right Menu
Item1
Item2
Item3