test/ant-design-blazor
1
0
Fork 0
mirror of https://gitee.com/ant-design-blazor/ant-design-blazor.git synced 2024-12-02 12:07:44 +08:00
Code Issues Actions 6 Packages Projects Releases Wiki Activity

fix(module: overlay): issues in boundaryAdjustMode (#1420)

Browse Source 
Co-authored-by: James Yeung <shunjiey@hotmail.com>
This commit is contained in:
笨木头 2021-04-28 20:44:23 +08:00 committed by GitHub
parent b27e4d47a6
commit ece46d4759
2 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
components/core/Component/Overlay/Overlay.razor.cs
View File

@ -437,6 +437,9 @@ namespace AntDesign.Internal
int overlaySize = direction == "top" ? overlay.ClientHeight : overlay.ClientWidth;
int boundarySize = await GetWindowBoundarySize(direction, containerElement);
// 距离边界的长度或宽度/distance from top or left boundry
int distanceFromBoundry = await GetOverlayDistanceFromBoundary(direction, curPos);
if (Trigger.Trigger.Contains(TriggerType.ContextMenu))
{
if (overlaySize + curPos > boundarySize)
@ -453,7 +456,8 @@ namespace AntDesign.Internal
int overlayPosWithSize = GetOverlayPosWithSize(curPos, overlaySize);
if (overlayPosWithSize > boundarySize || overlayPosWithSize < 0)
if ((overlayPosWithSize > boundarySize || overlayPosWithSize < 0)
&& distanceFromBoundry >= overlaySize) // check if still outof boundary after reverse placement
{
// 翻转位置/reverse placement
Trigger.ChangePlacementForShow(Trigger.Placement.GetReverseType());
@ -467,20 +471,7 @@ namespace AntDesign.Internal
curPos = reversePos;
}
/*
TODO： 翻转位置后仍然超出了边界/still outof boundary range after reverse placement
*/
//overlayPosWithSize = GetOverlayPosWithSize(curPos, overlaySize);
//if (overlayPosWithSize > boundarySize)
//{
// curPos = GetOverlayBoundaryPos(overlaySize, boundarySize);
//}
//else if (overlayPosWithSize < 0)
//{
// curPos -= overlayPosWithSize;
//}
return curPos;
return curPos < 0 ? 0 : curPos;
}
private int GetOverlayPosWithSize(int overlayPos, int overlaySize)
@ -511,6 +502,24 @@ namespace AntDesign.Internal
}
}
private async Task<int> GetOverlayDistanceFromBoundary(string direction, int overlayPos)
{
if (Trigger.BoundaryAdjustMode == TriggerBoundaryAdjustMode.InScroll)
{
return overlayPos;
}
JsonElement scrollInfo = await JsInvokeAsync<JsonElement>(JSInteropConstants.GetScroll);
int windowScrollX = (int)scrollInfo.GetProperty("x").GetDouble();
int windowScrollY = (int)scrollInfo.GetProperty("y").GetDouble();
return direction switch
{
"top" => overlayPos - windowScrollY,
_ => overlayPos - windowScrollX
};
}
private async Task<int> GetWindowBoundarySize(string direction, HtmlElement containerElement)
{
if (Trigger.BoundaryAdjustMode == TriggerBoundaryAdjustMode.InScroll)

6
components/menu/SubMenu.razor
View File

@ -39,6 +39,7 @@ else
TriggerClass="@ClassMapper.Class"
Visible="IsOpen"
ComplexAutoCloseAndVisible="true"
BoundaryAdjustMode="@TriggerBoundaryAdjustMode.None"
Disabled="Disabled"
Placement="Placement"
OnVisibleChange="OnOverlayVisibleChange"
@ -74,11 +75,6 @@ else
<style>
.ant-menu-vertical.ant-menu-sub,
.ant-menu-vertical.ant-menu-sub:not(.zoom-big-enter-active):not(.zoom-big-leave-active), .ant-menu-vertical-left.ant-menu-sub:not(.zoom-big-enter-active):not(.zoom-big-leave-active), .ant-menu-vertical-right.ant-menu-sub:not(.zoom-big-enter-active):not(.zoom-big-leave-active) {
overflow: initial;
}
.ant-menu.ant-menu-sub.ant-menu-vertical.ant-menu-submenu-popup {
top: 0;
left: 100%;