diff --git a/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx b/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx
index e2b85b9c5..81a8ec0db 100644
--- a/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx
+++ b/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx
@@ -14,10 +14,12 @@ import { disabledPropertyView, hiddenPropertyView } from "comps/utils/propertyUt
import { trans } from "i18n";
import { BoolCodeControl } from "comps/controls/codeControl";
import { DisabledContext } from "comps/generators/uiCompBuilder";
+import { BoolControl } from "@lowcoder-ee/comps/controls/boolControl";
export const ContainerBaseComp = (function () {
const childrenMap = {
disabled: BoolCodeControl,
+ showScroll: BoolControl.DEFAULT_TRUE,
};
return new ContainerCompBuilder(childrenMap, (props, dispatch) => {
return (
@@ -32,6 +34,8 @@ export const ContainerBaseComp = (function () {
{disabledPropertyView(children)}
{children.container.getPropertyView()}
+ {!children.container.children.autoHeight.getView() && children.showScroll.propertyView({
+ label: trans("container.showScroll")})}
{hiddenPropertyView(children)}
{children.container.stylePropertyView()}
diff --git a/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx b/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx
index f9c0e23a4..3ebf8c960 100644
--- a/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx
+++ b/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx
@@ -39,9 +39,11 @@ const BodyInnerGrid = styled(InnerGrid)<{
showBorder: boolean;
backgroundColor: string;
borderColor: string;
+ showScroll?: boolean;
}>`
border-top: ${(props) => `${props.showBorder ? 1 : 0}px solid ${props.borderColor}`};
flex: 1;
+ overflow: ${(props) => `${props.showScroll ? 'auto' : 'hidden'}`};
${(props) => props.backgroundColor && `background-color: ${props.backgroundColor};`}
border-radius: 0;
`;
@@ -59,6 +61,7 @@ const FooterInnerGrid = styled(InnerGrid)<{
export type TriContainerProps = TriContainerViewProps & {
hintPlaceholder?: ReactNode;
+ showScroll?: boolean;
};
export function TriContainer(props: TriContainerProps) {
@@ -110,6 +113,7 @@ export function TriContainer(props: TriContainerProps) {
hintPlaceholder={props.hintPlaceholder ?? HintPlaceHolder}
backgroundColor={style?.background}
borderColor={style?.border}
+ showScroll={props?.showScroll}
style={{padding: style.containerbodypadding}}
/>
diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts
index 941a77767..e6c754e0a 100644
--- a/client/packages/lowcoder/src/i18n/locales/en.ts
+++ b/client/packages/lowcoder/src/i18n/locales/en.ts
@@ -1355,6 +1355,7 @@ export const en = {
},
container: {
title: "Container title",
+ showScroll: "Show scroll",
},
drawer: {
placement: "Drawer placement",
diff --git a/client/packages/lowcoder/src/i18n/locales/zh.ts b/client/packages/lowcoder/src/i18n/locales/zh.ts
index 7fb2416d5..7880b30f1 100644
--- a/client/packages/lowcoder/src/i18n/locales/zh.ts
+++ b/client/packages/lowcoder/src/i18n/locales/zh.ts
@@ -1333,6 +1333,7 @@ selectionControl: {
},
container: {
title: "容器标题",
+ showScroll: "显示滚动条",
},
drawer: {
placement: "抽屉位置",