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

Commit c4c8c7d

Browse files
AgustinBonillaAgustinBonilla
committed
MaterialChips are improved
1 parent 01016fa commit c4c8c7d

3 files changed

Lines changed: 56 additions & 33 deletions

File tree

‎src/MaterialDesignControls/Controls/MaterialChips.xaml‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,11 @@
11
<?xml version="1.0" encoding="UTF-8"?>
2-
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:controls="clr-namespace:Plugin.MaterialDesignControls;assembly=Plugin.MaterialDesignControls" x:Class="Plugin.MaterialDesignControls.MaterialChips">
2+
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:controls="clr-namespace:Plugin.MaterialDesignControls;assembly=Plugin.MaterialDesignControls" xmlns:custom="clr-namespace:Plugin.MaterialDesignControls.Implementations;assembly=Plugin.MaterialDesignControls" x:Class="Plugin.MaterialDesignControls.MaterialChips">
33
<ContentView.Content>
44
<Frame x:Name="frmContainer" HasShadow="false" CornerRadius="16" Padding="12,0" MinimumHeightRequest="32" HeightRequest="32">
55
<StackLayout VerticalOptions="Center" Spacing="0" HorizontalOptions="Center" Orientation="Horizontal">
6-
<Grid x:Name="imgLeadingContainer" IsVisible="false" VerticalOptions="Center" HorizontalOptions="CenterAndExpand" WidthRequest="24" HeightRequest="26">
7-
<Image x:Name="imgLeading" HorizontalOptions="Start" VerticalOptions="CenterAndExpand" Aspect="AspectFit" WidthRequest="18" HeightRequest="18" />
8-
</Grid>
6+
<custom:CustomImageButton x:Name="imgLeadingIcon" IsVisible="false" HorizontalOptions="Start" Padding="0,0,4,0" ImageWidthRequest="18" ImageHeightRequest="18" />
97
<controls:MaterialLabel x:Name="lblText" HorizontalOptions="CenterAndExpand" LineBreakMode="NoWrap" VerticalOptions="Center" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" />
10-
<Grid x:Name="imgTrailingContainer" IsVisible="false" VerticalOptions="Center" HorizontalOptions="CenterAndExpand" WidthRequest="24" HeightRequest="26">
11-
<Image x:Name="imgTrailing" HorizontalOptions="End" VerticalOptions="CenterAndExpand" Aspect="AspectFit" WidthRequest="18" HeightRequest="18" />
12-
</Grid>
8+
<custom:CustomImageButton x:Name="imgTrailingIcon" IsVisible="false" HorizontalOptions="End" Padding="4,0,0,0" ImageWidthRequest="18" ImageHeightRequest="18" />
139
</StackLayout>
1410
</Frame>
1511
</ContentView.Content>

‎src/MaterialDesignControls/Controls/MaterialChips.xaml.cs‎

Lines changed: 18 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -298,12 +298,12 @@ protected override void OnPropertyChanged([CallerMemberName] string propertyName
298298
this.ApplyIsSelected();
299299
break;
300300
case nameof(this.TrailingIcon):
301-
this.imgTrailing.Source = this.TrailingIcon;
302-
this.imgTrailingContainer.IsVisible = true;
301+
this.imgTrailingIcon.Image.Source = this.TrailingIcon;
302+
this.imgTrailingIcon.IsVisible = true;
303303
break;
304304
case nameof(this.LeadingIcon):
305-
this.imgLeading.Source = this.LeadingIcon;
306-
this.imgLeadingContainer.IsVisible = true;
305+
this.imgTrailingIcon.Image.Source = this.LeadingIcon;
306+
this.imgTrailingIcon.IsVisible = true;
307307
break;
308308
case nameof(this.LeadingIconCommand):
309309
AddIconTapGesture(false);
@@ -322,32 +322,26 @@ private void AddIconTapGesture(bool isTrailingIcon)
322322
if (this.frmContainer.GestureRecognizers.Count > 0)
323323
this.frmContainer.GestureRecognizers.RemoveAt(0); //Remove main tap gesture
324324

325-
TapGestureRecognizer tapIconGestureRecognizer = new TapGestureRecognizer();
326-
tapIconGestureRecognizer.Tapped += (s, e) =>
325+
if (isTrailingIcon)
327326
{
328-
if (this.IsEnabled)
327+
this.imgTrailingIcon.Tapped = () =>
329328
{
330-
if (isTrailingIcon)
329+
if (this.IsEnabled && this.TrailingIconCommand != null)
331330
{
332-
if (this.TrailingIconCommand != null)
333-
{
334-
this.TrailingIconCommand.Execute(this.TrailingIconCommandParameter);
335-
}
331+
this.TrailingIconCommand.Execute(this.TrailingIconCommandParameter);
336332
}
337-
else
333+
};
334+
}
335+
else
336+
{
337+
this.imgLeadingIcon.Tapped = () =>
338+
{
339+
if (this.IsEnabled && this.LeadingIconCommand != null)
338340
{
339-
if (this.LeadingIconCommand != null)
340-
{
341-
this.LeadingIconCommand.Execute(this.LeadingIconCommandParameter);
342-
}
341+
this.LeadingIconCommand.Execute(this.LeadingIconCommandParameter);
343342
}
344-
}
345-
};
346-
347-
if (isTrailingIcon)
348-
imgTrailingContainer.GestureRecognizers.Add(tapIconGestureRecognizer);
349-
else
350-
imgLeadingContainer.GestureRecognizers.Add(tapIconGestureRecognizer);
343+
};
344+
}
351345
}
352346

353347
private void ApplyIsSelected()

‎src/MaterialDesignControls/Implementations/CustomImageButton.cs‎

Lines changed: 35 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
using System;
2+
using System.Runtime.CompilerServices;
23
using Xamarin.Forms;
34

45
namespace Plugin.MaterialDesignControls.Implementations
@@ -33,6 +34,22 @@ public Action Tapped
3334

3435
public Image Image { get; set; }
3536

37+
public static readonly BindableProperty ImageHeightRequestProperty = BindableProperty.Create(nameof(ImageHeightRequest), typeof(double), typeof(CustomImageButton), defaultValue: 24.0);
38+
39+
public double ImageHeightRequest
40+
{
41+
get { return (double)GetValue(ImageHeightRequestProperty); }
42+
set { SetValue(ImageHeightRequestProperty, value); }
43+
}
44+
45+
public static readonly BindableProperty ImageWidthRequestProperty = BindableProperty.Create(nameof(ImageWidthRequest), typeof(double), typeof(CustomImageButton), defaultValue: 24.0);
46+
47+
public double ImageWidthRequest
48+
{
49+
get { return (double)GetValue(ImageWidthRequestProperty); }
50+
set { SetValue(ImageWidthRequestProperty, value); }
51+
}
52+
3653
public CustomImageButton()
3754
{
3855
this.Padding = 6;
@@ -41,11 +58,27 @@ public CustomImageButton()
4158
this.Image = new Image
4259
{
4360
VerticalOptions = LayoutOptions.Center,
44-
WidthRequest = 24,
45-
HeightRequest = 24,
61+
HorizontalOptions = LayoutOptions.Center,
62+
WidthRequest = this.ImageWidthRequest,
63+
HeightRequest = this.ImageHeightRequest,
4664
};
4765

4866
this.Content = this.Image;
4967
}
68+
69+
protected override void OnPropertyChanged([CallerMemberName] string propertyName = null)
70+
{
71+
base.OnPropertyChanged(propertyName);
72+
73+
switch (propertyName)
74+
{
75+
case nameof(this.ImageWidthRequest):
76+
this.Image.WidthRequest = this.ImageWidthRequest;
77+
break;
78+
case nameof(this.ImageHeightRequest):
79+
this.Image.HeightRequest = this.ImageHeightRequest;
80+
break;
81+
}
82+
}
5083
}
5184
}

0 commit comments

Comments
 (0)