Skip to content
This repository was archived by the owner on May 1, 2024. It is now read-only.

Commit 7050f89

Browse files
authored
Add Threshold BindableProperty to SwipeView (#9574) fixes #8941 fixes #8974
1 parent 85f7e4f commit 7050f89

File tree

11 files changed

+645
-19
lines changed

11 files changed

+645
-19
lines changed
Lines changed: 195 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,195 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<ContentPage
3+
xmlns="http://xamarin.com/schemas/2014/forms"
4+
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
5+
x:Class="Xamarin.Forms.Controls.GalleryPages.SwipeViewGalleries.HorizontalSwipeThresholdGallery"
6+
Title="Horizontal SwipeThreshold Gallery">
7+
<ContentPage.Resources>
8+
<ResourceDictionary>
9+
10+
<Color x:Key="BackgroundColor">#2E249E</Color>
11+
<Color x:Key="SwipeItemBackgroundColor">#FE744D</Color>
12+
<Color x:Key="TitleColor">#55A1FA</Color>
13+
<Color x:Key="SubTitleColor">#FFFFFF</Color>
14+
15+
<Style x:Key="TitleStyle" TargetType="Label">
16+
<Setter Property="FontSize" Value="10" />
17+
<Setter Property="TextColor" Value="{StaticResource TitleColor}" />
18+
<Setter Property="Margin" Value="12, 18, 6, 6" />
19+
</Style>
20+
21+
<Style x:Key="SubTitleStyle" TargetType="Label">
22+
<Setter Property="TextColor" Value="{StaticResource SubTitleColor}" />
23+
<Setter Property="FontSize" Value="18" />
24+
<Setter Property="Margin" Value="12, 0, 6, 6" />
25+
</Style>
26+
27+
<Style x:Key="SwipeItemTextStyle" TargetType="Label">
28+
<Setter Property="TextColor" Value="White" />
29+
<Setter Property="FontAttributes" Value="Bold" />
30+
<Setter Property="FontSize" Value="12" />
31+
<Setter Property="HorizontalOptions" Value="Center" />
32+
<Setter Property="VerticalOptions" Value="Center" />
33+
</Style>
34+
35+
</ResourceDictionary>
36+
</ContentPage.Resources>
37+
<ContentPage.Content>
38+
<StackLayout
39+
Padding="12">
40+
<Label
41+
Text="The Threshold property is only implemented for now on Android and iOS."
42+
BackgroundColor="Black"
43+
TextColor="White"/>
44+
<Label
45+
Text="Default Threshold (Reveal Mode)"/>
46+
<SwipeView
47+
HeightRequest="80">
48+
<SwipeView.RightItems>
49+
<SwipeItems
50+
Mode="Reveal">
51+
<SwipeItem
52+
BackgroundColor="{StaticResource SwipeItemBackgroundColor}"
53+
Icon="calculator.png"
54+
Text="SwipeItem"/>
55+
</SwipeItems>
56+
</SwipeView.RightItems>
57+
<SwipeView.Content>
58+
<Grid
59+
BackgroundColor="{StaticResource BackgroundColor}"
60+
RowSpacing="0">
61+
<Grid.RowDefinitions>
62+
<RowDefinition Height="Auto" />
63+
<RowDefinition Height="Auto" />
64+
</Grid.RowDefinitions>
65+
<Label
66+
Grid.Row="0"
67+
Text="Default Threshold Behavior"
68+
Style="{StaticResource TitleStyle}"/>
69+
<Label
70+
Grid.Row="1"
71+
Text="Swipe to Left"
72+
Style="{StaticResource SubTitleStyle}"/>
73+
</Grid>
74+
</SwipeView.Content>
75+
</SwipeView>
76+
<Label
77+
Text="Custom Threshold (only one SwipeItem using Reveal Mode)"/>
78+
<Slider
79+
x:Name="ThresholdRevealSlider"
80+
Maximum="200"
81+
Minimum="50"
82+
Value="80"
83+
MaximumTrackColor="Gray"
84+
MinimumTrackColor="{StaticResource BackgroundColor}"
85+
ThumbColor="{StaticResource BackgroundColor}"
86+
ValueChanged="OnThresholdRevealSliderChanged"/>
87+
<SwipeView
88+
x:Name="RevealThresholdSwipeView"
89+
Threshold="{Binding Source={x:Reference ThresholdRevealSlider}, Path=Value}"
90+
HeightRequest="80">
91+
<SwipeView.RightItems>
92+
<SwipeItems
93+
Mode="Reveal">
94+
<SwipeItem
95+
BackgroundColor="{StaticResource SwipeItemBackgroundColor}"
96+
Icon="calculator.png"
97+
Text="SwipeItem"/>
98+
</SwipeItems>
99+
</SwipeView.RightItems>
100+
<SwipeView.Content>
101+
<Grid
102+
BackgroundColor="{StaticResource BackgroundColor}"
103+
RowSpacing="0">
104+
<Grid.RowDefinitions>
105+
<RowDefinition Height="Auto" />
106+
<RowDefinition Height="Auto" />
107+
</Grid.RowDefinitions>
108+
<Label
109+
Grid.Row="0"
110+
Text="Default Threshold Behavior"
111+
Style="{StaticResource TitleStyle}"/>
112+
<Label
113+
Grid.Row="1"
114+
Text="Swipe to Left"
115+
Style="{StaticResource SubTitleStyle}"/>
116+
</Grid>
117+
</SwipeView.Content>
118+
</SwipeView>
119+
<Label
120+
Text="Default Threshold (Execute Mode)"/>
121+
<SwipeView
122+
HeightRequest="80">
123+
<SwipeView.RightItems>
124+
<SwipeItems
125+
Mode="Execute">
126+
<SwipeItem
127+
BackgroundColor="{StaticResource SwipeItemBackgroundColor}"
128+
Icon="calculator.png"
129+
Text="SwipeItem"/>
130+
</SwipeItems>
131+
</SwipeView.RightItems>
132+
<SwipeView.Content>
133+
<Grid
134+
BackgroundColor="{StaticResource BackgroundColor}"
135+
RowSpacing="0">
136+
<Grid.RowDefinitions>
137+
<RowDefinition Height="Auto" />
138+
<RowDefinition Height="Auto" />
139+
</Grid.RowDefinitions>
140+
<Label
141+
Grid.Row="0"
142+
Text="Default Threshold Behavior"
143+
Style="{StaticResource TitleStyle}"/>
144+
<Label
145+
Grid.Row="1"
146+
Text="Swipe to Left"
147+
Style="{StaticResource SubTitleStyle}"/>
148+
</Grid>
149+
</SwipeView.Content>
150+
</SwipeView>
151+
<Label
152+
Text="Custom Threshold (only one SwipeItem using Execute Mode)"/>
153+
<Slider
154+
x:Name="ThresholdExecuteSlider"
155+
Maximum="300"
156+
Minimum="50"
157+
Value="80"
158+
MaximumTrackColor="Gray"
159+
MinimumTrackColor="{StaticResource BackgroundColor}"
160+
ThumbColor="{StaticResource BackgroundColor}"
161+
ValueChanged="OnThresholdExecuteSliderChanged"/>
162+
<SwipeView
163+
x:Name="ExecuteThresholdSwipeView"
164+
Threshold="{Binding Source={x:Reference ThresholdExecuteSlider}, Path=Value}"
165+
HeightRequest="80">
166+
<SwipeView.RightItems>
167+
<SwipeItems
168+
Mode="Execute">
169+
<SwipeItem
170+
BackgroundColor="{StaticResource SwipeItemBackgroundColor}"
171+
Icon="calculator.png"
172+
Text="SwipeItem"/>
173+
</SwipeItems>
174+
</SwipeView.RightItems>
175+
<SwipeView.Content>
176+
<Grid
177+
BackgroundColor="{StaticResource BackgroundColor}"
178+
RowSpacing="0">
179+
<Grid.RowDefinitions>
180+
<RowDefinition Height="Auto" />
181+
<RowDefinition Height="Auto" />
182+
</Grid.RowDefinitions>
183+
<Label
184+
Text="Default Threshold Behavior"
185+
Style="{StaticResource TitleStyle}"/>
186+
<Label
187+
Grid.Row="1"
188+
Text="Swipe to Left"
189+
Style="{StaticResource SubTitleStyle}"/>
190+
</Grid>
191+
</SwipeView.Content>
192+
</SwipeView>
193+
</StackLayout>
194+
</ContentPage.Content>
195+
</ContentPage>
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
namespace Xamarin.Forms.Controls.GalleryPages.SwipeViewGalleries
2+
{
3+
public partial class HorizontalSwipeThresholdGallery : ContentPage
4+
{
5+
public HorizontalSwipeThresholdGallery()
6+
{
7+
InitializeComponent();
8+
}
9+
10+
void OnThresholdRevealSliderChanged(object sender, ValueChangedEventArgs args)
11+
{
12+
RevealThresholdSwipeView.Close();
13+
}
14+
15+
void OnThresholdExecuteSliderChanged(object sender, ValueChangedEventArgs args)
16+
{
17+
ExecuteThresholdSwipeView.Close();
18+
}
19+
}
20+
}
Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<ContentPage
3+
xmlns="http://xamarin.com/schemas/2014/forms"
4+
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
5+
x:Class="Xamarin.Forms.Controls.GalleryPages.SwipeViewGalleries.SwipeThresholdCustomSwipeItemGallery"
6+
Title="Threshold with custom SwipeItem Gallery">
7+
<ContentPage.Resources>
8+
<ResourceDictionary>
9+
10+
<Color x:Key="BackgroundColor">#2E249E</Color>
11+
<Color x:Key="SwipeItemBackgroundColor">#FE744D</Color>
12+
<Color x:Key="TitleColor">#55A1FA</Color>
13+
<Color x:Key="SubTitleColor">#FFFFFF</Color>
14+
15+
<Style x:Key="TitleStyle" TargetType="Label">
16+
<Setter Property="FontSize" Value="10" />
17+
<Setter Property="TextColor" Value="{StaticResource TitleColor}" />
18+
<Setter Property="Margin" Value="6, 0, 6, 6" />
19+
</Style>
20+
21+
<Style x:Key="SubTitleStyle" TargetType="Label">
22+
<Setter Property="TextColor" Value="{StaticResource SubTitleColor}" />
23+
<Setter Property="FontSize" Value="18" />
24+
<Setter Property="Margin" Value="6, 0, 6, 6" />
25+
</Style>
26+
27+
<Style x:Key="SwipeItemTextStyle" TargetType="Label">
28+
<Setter Property="TextColor" Value="White" />
29+
<Setter Property="FontAttributes" Value="Bold" />
30+
<Setter Property="FontSize" Value="12" />
31+
<Setter Property="HorizontalOptions" Value="Center" />
32+
<Setter Property="VerticalOptions" Value="Center" />
33+
</Style>
34+
35+
</ResourceDictionary>
36+
</ContentPage.Resources>
37+
<ContentPage.Content>
38+
<StackLayout
39+
Padding="12">
40+
<Label
41+
Text="The Threshold property is only implemented for now on Android and iOS."
42+
BackgroundColor="Black"
43+
TextColor="White"/>
44+
<SwipeView
45+
HeightRequest="80">
46+
<SwipeView.RightItems>
47+
<SwipeItems
48+
Mode="Reveal">
49+
<SwipeItemView>
50+
<Grid
51+
WidthRequest="100">
52+
<BoxView
53+
BackgroundColor="{StaticResource SwipeItemBackgroundColor}"
54+
CornerRadius="0, 6, 0, 6" />
55+
<Label
56+
Text="SwipeItem"
57+
Style="{StaticResource SwipeItemTextStyle}"/>
58+
</Grid>
59+
</SwipeItemView>
60+
</SwipeItems>
61+
</SwipeView.RightItems>
62+
<SwipeView.Content>
63+
<Frame
64+
BackgroundColor="{StaticResource BackgroundColor}"
65+
CornerRadius="6"
66+
HasShadow="False"
67+
Padding="12">
68+
<Grid
69+
VerticalOptions="Center"
70+
RowSpacing="0">
71+
<Grid.RowDefinitions>
72+
<RowDefinition Height="Auto" />
73+
<RowDefinition Height="Auto" />
74+
</Grid.RowDefinitions>
75+
<Label
76+
Grid.Row="0"
77+
Text="Default Threshold"
78+
Style="{StaticResource TitleStyle}"/>
79+
<Label
80+
Grid.Row="1"
81+
Text="Swipe to the Left"
82+
Style="{StaticResource SubTitleStyle}"/>
83+
</Grid>
84+
</Frame>
85+
</SwipeView.Content>
86+
</SwipeView>
87+
<SwipeView
88+
Threshold="90"
89+
HeightRequest="80">
90+
<SwipeView.RightItems>
91+
<SwipeItems
92+
Mode="Reveal">
93+
<SwipeItemView>
94+
<Grid
95+
WidthRequest="100">
96+
<BoxView
97+
BackgroundColor="{StaticResource SwipeItemBackgroundColor}"
98+
CornerRadius="0, 6, 0, 6" />
99+
<Label
100+
Text="SwipeItem"
101+
Style="{StaticResource SwipeItemTextStyle}"/>
102+
</Grid>
103+
</SwipeItemView>
104+
</SwipeItems>
105+
</SwipeView.RightItems>
106+
<SwipeView.Content>
107+
<Frame
108+
BackgroundColor="{StaticResource BackgroundColor}"
109+
CornerRadius="6"
110+
HasShadow="False"
111+
Padding="12">
112+
<Grid
113+
VerticalOptions="Center"
114+
RowSpacing="0">
115+
<Grid.RowDefinitions>
116+
<RowDefinition Height="Auto" />
117+
<RowDefinition Height="Auto" />
118+
</Grid.RowDefinitions>
119+
<Label
120+
Grid.Row="0"
121+
Text="Custom Threshold (90)"
122+
Style="{StaticResource TitleStyle}"/>
123+
<Label
124+
Grid.Row="1"
125+
Text="Swipe to the Left"
126+
Style="{StaticResource SubTitleStyle}"/>
127+
</Grid>
128+
</Frame>
129+
</SwipeView.Content>
130+
</SwipeView>
131+
</StackLayout>
132+
</ContentPage.Content>
133+
</ContentPage>
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
namespace Xamarin.Forms.Controls.GalleryPages.SwipeViewGalleries
2+
{
3+
public partial class SwipeThresholdCustomSwipeItemGallery : ContentPage
4+
{
5+
public SwipeThresholdCustomSwipeItemGallery()
6+
{
7+
InitializeComponent();
8+
}
9+
}
10+
}
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
namespace Xamarin.Forms.Controls.GalleryPages.SwipeViewGalleries
2+
{
3+
public class SwipeThresholdGallery : ContentPage
4+
{
5+
public SwipeThresholdGallery()
6+
{
7+
Title = "SwipeThreshold Gallery";
8+
Content = new StackLayout
9+
{
10+
Children =
11+
{
12+
GalleryBuilder.NavButton("Horizontal SwipeThreshold Gallery", () => new HorizontalSwipeThresholdGallery(), Navigation),
13+
GalleryBuilder.NavButton("Vertical SwipeThreshold Gallery", () => new VerticalSwipeThresholdGallery(), Navigation),
14+
GalleryBuilder.NavButton("SwipeThreshold with Custom SwipeItem Gallery", () => new SwipeThresholdCustomSwipeItemGallery(), Navigation),
15+
}
16+
};
17+
}
18+
}
19+
}

Xamarin.Forms.Controls/GalleryPages/SwipeViewGalleries/SwipeViewGallery.cs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ public SwipeViewGallery()
1414
Children =
1515
{
1616
GalleryBuilder.NavButton("Basic SwipeView Gallery", () => new BasicSwipeGallery(), Navigation),
17+
GalleryBuilder.NavButton("SwipeView Threshold Gallery", () => new SwipeThresholdGallery(), Navigation),
1718
GalleryBuilder.NavButton("SwipeView Events Gallery", () => new SwipeViewEventsGallery(), Navigation),
1819
GalleryBuilder.NavButton("SwipeItems from Resource Gallery", () => new ResourceSwipeItemsGallery(), Navigation),
1920
GalleryBuilder.NavButton("BindableLayout Gallery", () => new SwipeBindableLayoutGallery(), Navigation),

0 commit comments

Comments
 (0)