Skip to content

Commit

Permalink
Merge pull request #8 from xtuzy/Modify
Browse files Browse the repository at this point in the history 
fix nest constraintlayout size not correct bug
  • Loading branch information
@xtuzy
xtuzy authored Jun 13, 2022
2 parents 780f3b0 + 899e6ef commit 0a56461
Show file tree
Hide file tree
Showing 6 changed files with 119 additions and 46 deletions.
122 changes: 86 additions & 36 deletions SharpConstraintLayout.Maui.Example/Pages/MainPage.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -182,33 +182,79 @@ void NestedConstraintLayoutTest(ConstraintLayout page)
{
(Button FirstButton, Button SecondButton, ContentView ThirdCanvas, Label FouthTextBlock, Entry FifthTextBox, Editor SixthRichTextBlock) = CreateControls();

var layout = new ConstraintLayout()
var leftLayout = new ConstraintLayout()
{
ConstrainPaddingTop = 10,
ConstrainPaddingBottom = 10,
ConstrainPaddingLeft = 10,
ConstrainPaddingRight = 10,
DebugName = "left",
Background = new SolidColorBrush(Colors.Red)
};

var rightLayout = new ConstraintLayout()
{
Background = new SolidColorBrush(Colors.Black)
ConstrainPaddingTop = 10,
ConstrainPaddingBottom = 10,
ConstrainPaddingLeft = 10,
ConstrainPaddingRight = 10,
DebugName = "right",
Background = new SolidColorBrush(Colors.Green)
};

using (var pageSet = new FluentConstraintSet())
{
page.AddElement(layout);
page.AddElement(leftLayout, rightLayout);
pageSet.Clone(page);
pageSet.Select(layout)
.CenterTo()
.Width(ConstraintSet.WrapContent)
.Height(ConstraintSet.WrapContent);
pageSet.Select(leftLayout)
.EdgesYTo(null, 10).LeftToLeft(null, 10).RightToLeft(rightLayout, 5)
.Width(SizeBehavier.MatchConstraint)
.Height(SizeBehavier.MatchParent)
.Select(rightLayout).EdgesYTo(null, 10).LeftToRight(leftLayout, 5).RightToRight(null, 10)
.Width(SizeBehavier.MatchConstraint)
.Height(SizeBehavier.MatchConstraint)
;

pageSet.ApplyTo(page);
layout.AddElement(ThirdCanvas);
layout.AddElement(FirstButton);
var leftChildView = new ConstraintLayout()
{
DebugName = "Second",
Background = new SolidColorBrush(Colors.Yellow)
};
leftLayout.AddElement(leftChildView);
using (var layoutSet = new FluentConstraintSet())
{
layoutSet.Clone(leftLayout);
layoutSet
.Select(leftChildView).EdgesTo(null, 20, 20)
.Width(SizeBehavier.MatchConstraint)
.Height(SizeBehavier.MatchConstraint);
layoutSet.ApplyTo(leftLayout);
}

var rightChildView = new ConstraintLayout()
{
DebugName = "Second",
Background = new SolidColorBrush(Colors.Yellow),
ConstrainWidth = ConstraintSet.WrapContent,
};
rightLayout.AddElement(rightChildView);
rightChildView.Add(FirstButton);
using (var layoutSet = new FluentConstraintSet())
{
layoutSet.Clone(layout);
layoutSet.Clone(rightLayout);
layoutSet
.Select(FirstButton).CenterXTo().CenterYTo()
.Width(FluentConstraintSet.SizeBehavier.WrapContent)
.Height(FluentConstraintSet.SizeBehavier.WrapContent)
.Select(ThirdCanvas).EdgesTo(null, 20, 20)
.Width(FluentConstraintSet.SizeBehavier.MatchParent)
.Height(FluentConstraintSet.SizeBehavier.MatchParent);
layoutSet.ApplyTo(layout);
.Select(rightChildView).EdgesTo(null, 20, 20)
.Width(SizeBehavier.WrapContent)
.Height(SizeBehavier.MatchConstraint);
layoutSet.ApplyTo(rightLayout);

using (var set = new FluentConstraintSet())
{
set.Clone(rightChildView);
set.Select(FirstButton).CenterTo();
set.ApplyTo(rightChildView);
}
}
}
}
Expand Down Expand Up @@ -535,40 +581,44 @@ private void ConstraintLayoutInListViewTest(ListView listView)
var layout = new ConstraintLayout() { ConstrainWidth = ConstraintSet.MatchParent, ConstrainHeight = ConstraintSet.WrapContent, BackgroundColor = Color.FromRgb(66, 66, 66) };
var title = new Label() { TextColor = Colors.White, FontSize = 30, FontAttributes = FontAttributes.Bold };
title.SetBinding(Label.TextProperty, nameof(Models.MicrosoftNews.Title));
var image = new Image();
image.SetBinding(Image.SourceProperty, nameof(Models.MicrosoftNews.ImageUrl));
//var image = new Image();
//image.SetBinding(Image.SourceProperty, nameof(Models.MicrosoftNews.ImageUrl));
var sourceFrom = new Label() { TextColor = Color.FromRgb(175, 165, 136), FontSize = 12, FontAttributes = FontAttributes.Bold };
sourceFrom.SetBinding(Label.TextProperty, nameof(Models.MicrosoftNews.SourceForm));
var sourceFromeImage = new Image();
sourceFromeImage.SetBinding(Image.SourceProperty, nameof(Models.MicrosoftNews.SourceForm));
layout.AddElement(image, title, sourceFromeImage, sourceFrom);
//var sourceFromeImage = new Image();
//sourceFromeImage.SetBinding(Image.SourceProperty, nameof(Models.MicrosoftNews.SourceForm));
layout.AddElement(
//image,
title,
//sourceFromeImage,
sourceFrom);

var guideLine = new Guideline() { };
layout.AddElement(guideLine);

var littleWindow = new FluentConstraintSet();
littleWindow.Clone(layout);
littleWindow
.Select(guideLine, image, sourceFromeImage, sourceFrom, title).Clear()//需要移除之前的约束
.Select(guideLine,
//image, sourceFromeImage,
sourceFrom, title).Clear()//需要移除之前的约束
.Select(guideLine).GuidelineOrientation(Orientation.X).GuidelinePercent(0.6f)
.Select(image).EdgesXTo().BottomToTop(guideLine)
.Width(SizeBehavier.MatchParent).Height(SizeBehavier.WrapContent)
.Select(sourceFromeImage).LeftToLeft(null, 20).BottomToTop(title, 20)
.Width(SizeBehavier.WrapContent).Height(SizeBehavier.WrapContent)
.Select(sourceFrom).LeftToRight(sourceFromeImage, 20).CenterYTo(sourceFromeImage)
//.Select(image).EdgesXTo().BottomToTop(guideLine).Width(SizeBehavier.MatchParent).Height(SizeBehavier.WrapContent)
//.Select(sourceFromeImage).LeftToLeft(null, 20).BottomToTop(title, 20).Width(SizeBehavier.WrapContent).Height(SizeBehavier.WrapContent)
.Select(sourceFrom)//.LeftToRight(sourceFromeImage, 20).CenterYTo(sourceFromeImage)
.Select(title).LeftToLeft(null, 20).RightToRight(null, 20).BottomToBottom(null, 20).Width(SizeBehavier.MatchConstraint);

var bigWindow = new FluentConstraintSet();
bigWindow.Clone(layout);
bigWindow
.Select(guideLine, image, sourceFromeImage, sourceFrom, title).Clear()//需要移除之前的约束
.Select(image).RightToRight(null, 20).TopToTop(null, 20)
.Width(140).Height(140)
.Select(sourceFromeImage).LeftToLeft(null, 20).TopToTop(image)
.Width(SizeBehavier.WrapContent).Height(SizeBehavier.WrapContent)
.Select(sourceFrom).LeftToRight(sourceFromeImage, 20).CenterYTo(sourceFromeImage)
.Select(title).LeftToLeft(null, 20).RightToLeft(image, 20).TopToBottom(sourceFromeImage, 20).Width(SizeBehavier.MatchConstraint);

.Select(guideLine,
//image, sourceFromeImage,
sourceFrom, title).Clear()//需要移除之前的约束
//.Select(image).RightToRight(null, 20).TopToTop(null, 20).Width(140).Height(140)
//.Select(sourceFromeImage).LeftToLeft(null, 20).TopToTop(image).Width(SizeBehavier.WrapContent).Height(SizeBehavier.WrapContent)
.Select(sourceFrom)//.LeftToRight(sourceFromeImage, 20).CenterYTo(sourceFromeImage)
.Select(title).LeftToLeft(null, 20)//.RightToLeft(image, 20).TopToBottom(sourceFromeImage, 20).Width(SizeBehavier.MatchConstraint);
;
double oldValue = -1;
layout.SizeChanged += (sender, e) =>
{
Expand Down
1 change: 1 addition & 0 deletions SharpConstraintLayout.Maui.Example/Pages/MainPage.xaml.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ ConstraintLayout CreateConstraintLayout()
ConstrainPaddingBottom = 10,
ConstrainPaddingLeft = 10,
ConstrainPaddingRight = 10,
DebugName = "Root",
Background = new SolidColorBrush(Colors.HotPink),
};
gridLayout.RemoveAt(gridLayout.Count - 1);
Expand Down
6 changes: 4 additions & 2 deletions SharpConstraintLayout.Maui.Native/Helper/Widget/Flow.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -185,8 +185,10 @@ public override void onMeasure(androidx.constraintlayout.core.widgets.VirtualLay
if (ConstraintLayout.DEBUG) Debug.WriteLine(TAG, $"widthMode {widthMode}, widthSize {widthSize}, heightMode {heightMode}, heightSize {heightSize}");
layout.measure(widthMode, widthSize, heightMode, heightSize);
#if __MAUI__
this.WidthRequest = layout.Width;
this.HeightRequest = layout.Height;
//this.WidthRequest = layout.Width;
//this.HeightRequest = layout.Height;给WidthRequest赋值造成测量循环

MeasuredSize = new Size(layout.MeasuredWidth, layout.MeasuredHeight);
#elif __ANDROID__ && !__MAUI__
SetMeasuredDimension(layout.MeasuredWidth, layout.MeasuredHeight);//Android中这个的作用应该是设置flow的大小
#elif __IOS__ && !__MAUI__
Expand Down
31 changes: 24 additions & 7 deletions SharpConstraintLayout.Maui.Native/Widget/ConstraintLayout.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,7 @@ public partial class ConstraintLayout : Panel, IConstraintLayout
/// if is true,will print some layout info.
/// </summary>
public static bool DEBUG = false;
public string DebugName;
/// <summary>
/// if is true,will print time of measure spend.
/// </summary>
Expand Down Expand Up @@ -335,7 +336,9 @@ public int ConstrainMaxHeight
}

/// <summary>
/// 约束自身的大小,可能会与父布局产生冲突
/// 该属性约束自身的高度,其值可以是固定数值,或者<see cref="ConstraintSet.WrapContent"/>,<see cref="ConstraintSet.MatchConstraint"/>,<see cref="ConstraintSet.MatchParent"/>,
/// 当依赖Parent给与的高度时,使用<see cref="ConstraintSet.MatchParent"/>,其为默认;当依赖自身Child的大小时,使用其它.
/// (因为父布局的行为不能确定,因此可能会与父布局产生冲突,请多加尝试)
/// </summary>
public int ConstrainHeight
{
Expand All @@ -358,6 +361,11 @@ public int ConstrainHeight
}
}

/// <summary>
/// 该属性约束自身的宽度,其值可以是固定数值,或者<see cref="ConstraintSet.WrapContent"/>,<see cref="ConstraintSet.MatchConstraint"/>,<see cref="ConstraintSet.MatchParent"/>,
/// 当依赖Parent给与的宽度时,使用<see cref="ConstraintSet.MatchParent"/>,其为默认;当依赖自身Child的大小时,使用其它.
/// (因为父布局的行为不能确定,因此可能会与父布局产生冲突,请多加尝试)
/// </summary>
public int ConstrainWidth
{
get
Expand All @@ -383,11 +391,14 @@ public int ConstrainWidth
#endregion LayoutProperty

#region Measure

/*@zhouyang 2022/6/13 注释掉.
/// <summary>
/// 存储MeasureSpec给子ConstraintLayout使用,因为iOS和Windows布局体系里本身不传递
/// </summary>
public int HorizontalSpec { get; set; } = 0;
public int VerticalSpec { get; set; } = 0;
*/

/// <summary>
/// Android中Spec由parent制作,其它平台需自己制作
Expand Down Expand Up @@ -477,7 +488,12 @@ public int ConstrainWidth
verticalSpec = AndroidMeasureSpec.MakeMeasureSpec(constrainHeight, AndroidMeasureSpec.EXACTLY);
}

if (!isInfinityAvailabelWidth && constrainWidth <= 0)
/*
* @zhouyang 2022/6/13 注释掉以下与HorizontalSpec相关代码.
* 在处理嵌套ConstraintLayout时,如果指定了子ConstraintLayout的大小,那么Measure时传入ConsraintLayout的值应该是确定的,
* 如果再使用Parent的度量值去计算,那么大小会不正确.
*/
/*if (!isInfinityAvailabelWidth && constrainWidth <= 0)
{
if (this.GetParent() is ConstraintLayout)
{
Expand All @@ -503,21 +519,20 @@ public int ConstrainWidth
else
if (DEBUG) SimpleDebug.WriteLine($"{parent} verticalSpec is 0");
}

}
}*/

isInfinityAvailabelWidth = false;
isInfinityAvailabelHeight = false;

//存储Spec给Child使用
/*//存储Spec给Child使用
if (horizontalSpec != HorizontalSpec)
{
HorizontalSpec = horizontalSpec;
}
if (verticalSpec != VerticalSpec)
{
VerticalSpec = verticalSpec;
}
}*/

return (horizontalSpec, verticalSpec);
}
Expand Down Expand Up @@ -1107,7 +1122,9 @@ public void AndroidSourceCodeMeasureUseSpecForWindows(ConstraintWidget widget, B
((VirtualLayout)child).onMeasure(layout, horizontalSpec, verticalSpec);
if (DEBUG) SimpleDebug.WriteLine($"{child.GetType().FullName} after onMeasure: widget={widget},control={child.GetViewLayoutInfo()}");
#if __MAUI__
(w, h) = ((int)child.WidthRequest, (int)child.HeightRequest);
//(w, h) = ((int)child.WidthRequest, (int)child.HeightRequest);
var size = (child as VirtualLayout).MeasuredSize;
(w, h) = ((int)size.Width, (int)size.Height);
#elif __IOS__ && !__MAUI__
(w, h) = ((int)child.Bounds.Width, (int)child.Bounds.Height);//我在iOS的Flow中,将测量值存储到了Bounds
#elif WINDOWS && !__MAUI__
Expand Down
3 changes: 3 additions & 0 deletions SharpConstraintLayout.Maui.Native/Widget/VirtualLayout.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,9 @@ protected override void init()
base.init();
}

#if __MAUI__
public Size MeasuredSize;//创建这个变量专门存储Widget测量值
#endif
public virtual void onMeasure(androidx.constraintlayout.core.widgets.VirtualLayout layout, int widthMeasureSpec, int heightMeasureSpec)
{
// nothing
Expand Down
2 changes: 1 addition & 1 deletion SharpConstraintLayout.Maui/SharpConstraintLayout.Maui.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</SupportedOSPlatformVersion>
<TargetPlatformMinVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</TargetPlatformMinVersion>
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'tizen'">6.5</SupportedOSPlatformVersion>
<Version>2.1.1.4</Version>
<Version>2.1.1.5</Version>
<Description>constraintlayout for maui</Description>
<Copyright></Copyright>
<PackageProjectUrl>https://github.com/xtuzy/SharpConstraintLayout</PackageProjectUrl>
Expand Down

0 comments on commit 0a56461

Please sign in to comment.