Skip to content

Commit eb97cad

Browse files
kazo0kazo0
authored
Merge pull request #4914 from unoplatform/dev/sb/corner-radius-border
Allow variable BorderThickness while using CornerRadius on Border
2 parents 2e5e472 + 54f82cc commit eb97cad

File tree

8 files changed

+536
-84
lines changed

8 files changed

+536
-84
lines changed

‎src/SamplesApp/SamplesApp.UITests/Windows_UI_Xaml_Controls/BorderTests/Border_Tests.cs

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,5 +52,76 @@ public void Check_CornerRadius_Border()
5252

5353
ImageAssert.AreAlmostEqual(scrBefore, scrAfter, verificationRect, permittedPixelError: 5);
5454
}
55+
56+
[Test]
57+
[AutoRetry]
58+
public void Border_CornerRadius_BorderThickness()
59+
{
60+
const string red = "#FF0000";
61+
const string blue = "#0000FF";
62+
63+
var expectedColors = new[]
64+
{
65+
new ExpectedColor { Thicknesses = new [] { 10, 10, 10, 10 }, Colors = new [] { red, red, red, red } },
66+
new ExpectedColor { Thicknesses = new [] { 10, 0, 10, 10 }, Colors = new [] { red, blue, red, red } },
67+
new ExpectedColor { Thicknesses = new [] { 10, 0, 0, 10 }, Colors = new [] { red, blue, blue, red } },
68+
new ExpectedColor { Thicknesses = new [] { 10, 0, 0, 0 }, Colors = new [] { red, blue, blue, blue } },
69+
new ExpectedColor { Thicknesses = new [] { 0, 0, 0, 0 }, Colors = new [] { blue, blue, blue, blue } },
70+
};
71+
72+
Run("UITests.Windows_UI_Xaml_Controls.BorderTests.Border_CornerRadius_BorderThickness");
73+
74+
_app.WaitForElement("MyBorder");
75+
76+
var leftTarget = _app.GetPhysicalRect("LeftTarget");
77+
var topTarget = _app.GetPhysicalRect("TopTarget");
78+
var rightTarget = _app.GetPhysicalRect("RightTarget");
79+
var bottomTarget = _app.GetPhysicalRect("BottomTarget");
80+
81+
SetBorderProperty("MyBorder", "CornerRadius", "10");
82+
83+
foreach (var expected in expectedColors)
84+
{
85+
SetBorderProperty("MyBorder", "BorderThickness", expected.ToString());
86+
87+
using var snapshot = TakeScreenshot($"Border-CornerRadius-10-BorderThickness-{expected}");
88+
89+
ImageAssert.HasPixels(
90+
snapshot,
91+
ExpectedPixels
92+
.At($"left-{expected}-progress", leftTarget.CenterX, leftTarget.CenterY)
93+
.WithPixelTolerance(1, 1)
94+
.Pixel(expected.Colors[0]),
95+
ExpectedPixels
96+
.At($"top-{expected}-progress", topTarget.CenterX, topTarget.CenterY)
97+
.WithPixelTolerance(1, 1)
98+
.Pixel(expected.Colors[1]),
99+
ExpectedPixels
100+
.At($"right-{expected}-progress", rightTarget.CenterX, rightTarget.CenterY)
101+
.WithPixelTolerance(1, 1)
102+
.Pixel(expected.Colors[2]),
103+
ExpectedPixels
104+
.At($"bottom-{expected}-progress", bottomTarget.CenterX, bottomTarget.CenterY)
105+
.WithPixelTolerance(1, 1)
106+
.Pixel(expected.Colors[3])
107+
);
108+
}
109+
}
110+
111+
private void SetBorderProperty(string borderName, string propertyName, string value)
112+
{
113+
Console.WriteLine($"Setting {borderName}'s {propertyName} to {value}");
114+
var slider = _app.Marked(borderName);
115+
var _ = slider.SetDependencyPropertyValue(propertyName, value);
116+
}
117+
118+
private struct ExpectedColor
119+
{
120+
public int[] Thicknesses { get; set; }
121+
122+
public string[] Colors { get; set; }
123+
124+
public override string ToString() => $"{Thicknesses[0]} {Thicknesses[1]} {Thicknesses[2]} {Thicknesses[3]}";
125+
}
55126
}
56127
}

‎src/SamplesApp/UITests.Shared/UITests.Shared.projitems

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -837,6 +837,10 @@
837837
<SubType>Designer</SubType>
838838
<Generator>MSBuild:Compile</Generator>
839839
</Page>
840+
<Page Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\BorderTests\Border_CornerRadius_BorderThickness.xaml">
841+
<SubType>Designer</SubType>
842+
<Generator>MSBuild:Compile</Generator>
843+
</Page>
840844
<Page Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\BorderTests\Border_CornerRadius_Toggle.xaml">
841845
<SubType>Designer</SubType>
842846
<Generator>MSBuild:Compile</Generator>
@@ -4332,6 +4336,9 @@
43324336
<Compile Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\BorderTests\Border_Clipped_Change_Property.xaml.cs">
43334337
<DependentUpon>Border_Clipped_Change_Property.xaml</DependentUpon>
43344338
</Compile>
4339+
<Compile Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\BorderTests\Border_CornerRadius_BorderThickness.xaml.cs">
4340+
<DependentUpon>Border_CornerRadius_BorderThickness.xaml</DependentUpon>
4341+
</Compile>
43354342
<Compile Include="$(MSBuildThisFileDirectory)Windows_UI_Xaml_Controls\BorderTests\Border_CornerRadius_Toggle.xaml.cs">
43364343
<DependentUpon>Border_CornerRadius_Toggle.xaml</DependentUpon>
43374344
</Compile>

‎src/SamplesApp/UITests.Shared/Windows_UI_Xaml_Controls/BorderTests/Border_CornerRadius_BorderThickness.xaml

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
<UserControl
2+
x:Class="UITests.Windows_UI_Xaml_Controls.BorderTests.Border_CornerRadius_BorderThickness"
3+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5+
xmlns:local="using:UITests.Windows_UI_Xaml_Controls.BorderTests"
6+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
7+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
8+
mc:Ignorable="d"
9+
d:DesignHeight="300"
10+
d:DesignWidth="400">
11+
12+
<ScrollViewer>
13+
<StackPanel Spacing="10"
14+
Width="400">
15+
<Grid Width="200"
16+
Height="200">
17+
<Border Width="200"
18+
Height="200"
19+
x:Name="MyBorder"
20+
BorderThickness="{x:Bind MyBorderThickness, Mode=TwoWay}"
21+
CornerRadius="{x:Bind MyCornerRadius, Mode=TwoWay}"
22+
BorderBrush="Red"
23+
Background="Blue"/>
24+
<Border BorderBrush="Yellow"
25+
x:Name="LeftTarget"
26+
HorizontalAlignment="Left"
27+
VerticalAlignment="Center"
28+
BorderThickness="1"
29+
Height="10"
30+
Width="10"/>
31+
<Border BorderBrush="Yellow"
32+
x:Name="TopTarget"
33+
HorizontalAlignment="Center"
34+
VerticalAlignment="Top"
35+
BorderThickness="1"
36+
Height="10"
37+
Width="10"/>
38+
<Border BorderBrush="Yellow"
39+
x:Name="RightTarget"
40+
HorizontalAlignment="Right"
41+
VerticalAlignment="Center"
42+
BorderThickness="1"
43+
Height="10"
44+
Width="10"/>
45+
<Border BorderBrush="Yellow"
46+
x:Name="BottomTarget"
47+
HorizontalAlignment="Center"
48+
VerticalAlignment="Bottom"
49+
BorderThickness="1"
50+
Height="10"
51+
Width="10"/>
52+
</Grid>
53+
<StackPanel Orientation="Horizontal"
54+
Spacing="10">
55+
<TextBlock Text="CornerRadius:"/>
56+
<CheckBox Content="Lock"
57+
x:Name="LockCornerRadiusCheck"
58+
IsChecked="{x:Bind LockCornerRadius, Mode=TwoWay}"/>
59+
</StackPanel>
60+
<TextBlock Text="Top Left:" />
61+
<Slider Minimum="0"
62+
Maximum="100"
63+
x:Name="TopLeftCornerRadiusSlider"
64+
Value="{x:Bind TopLeftCornerRadius, Mode=TwoWay}"/>
65+
<TextBlock Text="Top Right:" />
66+
<Slider Minimum="0"
67+
Maximum="100"
68+
x:Name="TopRightCornerRadiusSlider"
69+
Value="{x:Bind TopRightCornerRadius, Mode=TwoWay}"/>
70+
<TextBlock Text="Bottom Right:" />
71+
<Slider Minimum="0"
72+
Maximum="100"
73+
x:Name="BottomRightCornerRadiusSlider"
74+
Value="{x:Bind BottomRightCornerRadius, Mode=TwoWay}"/>
75+
<TextBlock Text="Bottom Left:" />
76+
<Slider Minimum="0"
77+
Maximum="100"
78+
x:Name="BottomLeftCornerRadiusSlider"
79+
Value="{x:Bind BottomLeftCornerRadius, Mode=TwoWay}"/>
80+
81+
<StackPanel Orientation="Horizontal"
82+
Spacing="10">
83+
<TextBlock Text="BorderThickness:"/>
84+
<CheckBox Content="Lock"
85+
x:Name="LockBorderThicknessCheck"
86+
IsChecked="{x:Bind LockBorderThickness, Mode=TwoWay}"/>
87+
</StackPanel>
88+
<TextBlock Text="Left:" />
89+
<Slider Minimum="0"
90+
Maximum="100"
91+
x:Name="LeftBorderThicknessSlider"
92+
Value="{x:Bind LeftBorderThickness, Mode=TwoWay}"/>
93+
<TextBlock Text="Top:" />
94+
<Slider Minimum="0"
95+
Maximum="100"
96+
x:Name="TopBorderThicknessSlider"
97+
Value="{x:Bind TopBorderThickness, Mode=TwoWay}"/>
98+
<TextBlock Text="Right:" />
99+
<Slider Minimum="0"
100+
Maximum="100"
101+
x:Name="RightBorderThicknessSlider"
102+
Value="{x:Bind RightBorderThickness, Mode=TwoWay}"/>
103+
<TextBlock Text="Bottom:" />
104+
<Slider Minimum="0"
105+
Maximum="100"
106+
x:Name="BottomBorderThicknessSlider"
107+
Value="{x:Bind BottomBorderThickness, Mode=TwoWay}"/>
108+
</StackPanel>
109+
</ScrollViewer>
110+
</UserControl>

0 commit comments

Comments
 (0)