Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Windows] Fix Picker alignment issues #13516

Merged
merged 8 commits into from
Mar 17, 2023
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,37 @@
Clicked="OnRemoveBindingContextClicked" />
</StackLayout>

<Label
Text="Alignment"
Style="{StaticResource Headline}" />
<Grid
HeightRequest="150"
RowDefinitions="Auto, *">
<HorizontalStackLayout
HorizontalOptions="Center">
<Button
x:Name="HorizontalOptionsButton"
Text="Update HorizontalOptions"
Clicked="OnUpdateHorizontalOptionsClicked"/>
<Button
x:Name="VerticalOptionsButton"
Text="Update VerticalOptions"
Clicked="OnUpdateVerticalOptionsClicked"/>
</HorizontalStackLayout>
<Picker
x:Name="AlignmentPicker"
Grid.Row="1"
SelectedIndex="0"
BackgroundColor="Green"
TextColor="White"
Margin="0, 6">
<Picker.Items>
<x:String>Item 1</x:String>
<x:String>Item 2</x:String>
<x:String>Item 3</x:String>
</Picker.Items>
</Picker>
</Grid>
</VerticalStackLayout>
</ScrollView>
</views:BasePage.Content>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,9 @@ namespace Maui.Controls.Sample.Pages
{
public partial class PickerPage
{
int _horizontalOptionsIndex;
int _verticalOptionsIndex;

public PickerPage()
{
InitializeComponent();
Expand Down Expand Up @@ -112,6 +115,54 @@ void UpdatePickerBindingContext()
}
};
}

void OnUpdateHorizontalOptionsClicked(object sender, EventArgs e)
{
switch (_horizontalOptionsIndex)
{
case 0:
AlignmentPicker.HorizontalOptions = LayoutOptions.Start;
break;
case 1:
AlignmentPicker.HorizontalOptions = LayoutOptions.Center;
break;
case 2:
AlignmentPicker.HorizontalOptions = LayoutOptions.End;
break;
case 3:
AlignmentPicker.HorizontalOptions = LayoutOptions.Fill;
break;
}

_horizontalOptionsIndex++;

if (_horizontalOptionsIndex == 4)
_horizontalOptionsIndex = 0;
}

void OnUpdateVerticalOptionsClicked(object sender, EventArgs e)
{
_verticalOptionsIndex++;

switch (_verticalOptionsIndex)
{
case 0:
AlignmentPicker.VerticalOptions = LayoutOptions.Start;
break;
case 1:
AlignmentPicker.VerticalOptions = LayoutOptions.Center;
break;
case 2:
AlignmentPicker.VerticalOptions = LayoutOptions.End;
break;
case 3:
AlignmentPicker.VerticalOptions = LayoutOptions.Fill;
break;
}

if (_verticalOptionsIndex == 4)
_verticalOptionsIndex = 0;
}
jsuarezruiz marked this conversation as resolved.
Show resolved Hide resolved
}

public class PickerData
Expand Down
13 changes: 12 additions & 1 deletion src/Controls/src/Core/HandlerImpl/Picker/Picker.Windows.cs
Original file line number Diff line number Diff line change
@@ -1,7 +1,18 @@
namespace Microsoft.Maui.Controls
using System;
using Microsoft.Maui.Controls.Platform;

namespace Microsoft.Maui.Controls
{
public partial class Picker
{
public static void MapHorizontalOptions(IPickerHandler handler, Picker picker)
{
handler.PlatformView?.UpdateHorizontalOptions(picker);
}

public static void MapVerticalOptions(IPickerHandler handler, Picker picker)
{
handler.PlatformView?.UpdateVerticalOptions(picker);
}
}
}
3 changes: 3 additions & 0 deletions src/Controls/src/Core/HandlerImpl/Picker/Picker.cs
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,9 @@ public partial class Picker
{
#if IOS
[PlatformConfiguration.iOSSpecific.Picker.UpdateModeProperty.PropertyName] = MapUpdateMode,
#elif WINDOWS
[nameof(Picker.HorizontalOptions)] = MapHorizontalOptions,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It is a Draft because I am reviewing why this is necessary in the case of the Picker in Windows.

[nameof(Picker.VerticalOptions)] = MapVerticalOptions,
#endif
[nameof(Picker.ItemsSource)] = (handler, _) => handler.UpdateValue(nameof(IPicker.Items))
};
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
using System;
using Microsoft.UI.Xaml;

namespace Microsoft.Maui.Controls.Platform
{
public static class PickerExtensions
{
public static void UpdateHorizontalOptions(this FrameworkElement platformView, View view)
{
platformView.HorizontalAlignment = view.HorizontalOptions.Alignment switch
{
LayoutAlignment.Start => HorizontalAlignment.Left,
LayoutAlignment.Center => HorizontalAlignment.Center,
LayoutAlignment.End => HorizontalAlignment.Right,
LayoutAlignment.Fill => HorizontalAlignment.Stretch,
_ => throw new ArgumentOutOfRangeException()
};
}

public static void UpdateVerticalOptions(this FrameworkElement platformView, View view)
{
platformView.VerticalAlignment = view.VerticalOptions.Alignment switch
{
LayoutAlignment.Start => VerticalAlignment.Top,
LayoutAlignment.Center => VerticalAlignment.Center,
LayoutAlignment.End => VerticalAlignment.Bottom,
LayoutAlignment.Fill => VerticalAlignment.Stretch,
_ => throw new ArgumentOutOfRangeException()
};
}
}
}
Original file line number Diff line number Diff line change
@@ -1,13 +1,18 @@
#nullable enable
*REMOVED*override Microsoft.Maui.Controls.RefreshView.MeasureOverride(double widthConstraint, double heightConstraint) -> Microsoft.Maui.Graphics.Size
Microsoft.Maui.Controls.LayoutOptions.Equals(Microsoft.Maui.Controls.LayoutOptions other) -> bool
Microsoft.Maui.Controls.Platform.PickerExtensions
Microsoft.Maui.Controls.Region.Equals(Microsoft.Maui.Controls.Region other) -> bool
Microsoft.Maui.Controls.Shapes.Matrix.Equals(Microsoft.Maui.Controls.Shapes.Matrix other) -> bool
override Microsoft.Maui.Controls.LayoutOptions.GetHashCode() -> int
override Microsoft.Maui.Controls.Region.GetHashCode() -> int
override Microsoft.Maui.Controls.Shapes.Matrix.GetHashCode() -> int
static Microsoft.Maui.Controls.LayoutOptions.operator !=(Microsoft.Maui.Controls.LayoutOptions left, Microsoft.Maui.Controls.LayoutOptions right) -> bool
static Microsoft.Maui.Controls.LayoutOptions.operator ==(Microsoft.Maui.Controls.LayoutOptions left, Microsoft.Maui.Controls.LayoutOptions right) -> bool
static Microsoft.Maui.Controls.Picker.MapHorizontalOptions(Microsoft.Maui.Handlers.IPickerHandler! handler, Microsoft.Maui.Controls.Picker! picker) -> void
static Microsoft.Maui.Controls.Picker.MapVerticalOptions(Microsoft.Maui.Handlers.IPickerHandler! handler, Microsoft.Maui.Controls.Picker! picker) -> void
static Microsoft.Maui.Controls.Platform.PickerExtensions.UpdateHorizontalOptions(this Microsoft.UI.Xaml.FrameworkElement! platformView, Microsoft.Maui.Controls.View! view) -> void
static Microsoft.Maui.Controls.Platform.PickerExtensions.UpdateVerticalOptions(this Microsoft.UI.Xaml.FrameworkElement! platformView, Microsoft.Maui.Controls.View! view) -> void
static Microsoft.Maui.Controls.Region.operator !=(Microsoft.Maui.Controls.Region left, Microsoft.Maui.Controls.Region right) -> bool
static Microsoft.Maui.Controls.Region.operator ==(Microsoft.Maui.Controls.Region left, Microsoft.Maui.Controls.Region right) -> bool
static Microsoft.Maui.Controls.Shapes.Matrix.operator !=(Microsoft.Maui.Controls.Shapes.Matrix left, Microsoft.Maui.Controls.Shapes.Matrix right) -> bool
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Threading.Tasks;
using Microsoft.Maui.Controls;
using Microsoft.Maui.Graphics;
Expand All @@ -12,6 +13,48 @@ namespace Microsoft.Maui.DeviceTests
{
public partial class PickerTests : ControlsHandlerTestBase
{
[Fact(DisplayName = "HorizontalOptions Initializes Correctly")]
public async Task HorizontalOptionsInitializesCorrectly()
{
var items = new ObservableCollection<string>()
{
"Item 1",
"Item 2"
};

Picker picker = new Picker()
{
HorizontalOptions = LayoutOptions.End,
ItemsSource = items,
SelectedIndex = 0
};

var handler = await CreateHandlerAsync<PickerHandler>(picker);

Assert.Equal(UI.Xaml.HorizontalAlignment.Right, GetPlatformHorizontalOptions(handler.PlatformView));
}

[Fact(DisplayName = "VerticalOptions Initializes Correctly")]
public async Task VerticalOptionsInitializesCorrectly()
{
var items = new ObservableCollection<string>()
{
"Item 1",
"Item 2"
};

Picker picker = new Picker()
{
VerticalOptions = LayoutOptions.End,
ItemsSource = items,
SelectedIndex = 0
};

var handler = await CreateHandlerAsync<PickerHandler>(picker);

Assert.Equal(UI.Xaml.VerticalAlignment.Bottom, GetPlatformVerticalOptions(handler.PlatformView));
}

protected Task<string> GetPlatformControlText(ComboBox platformView)
{
return InvokeOnMainThreadAsync(() =>
Expand All @@ -28,5 +71,15 @@ protected Task<string> GetPlatformControlText(ComboBox platformView)
return platformView.SelectedItem?.ToString();
});
}

UI.Xaml.HorizontalAlignment GetPlatformHorizontalOptions(ComboBox platformView)
{
return platformView.HorizontalAlignment;
}

UI.Xaml.VerticalAlignment GetPlatformVerticalOptions(ComboBox platformView)
{
return platformView.VerticalAlignment;
}
}
}