fix: 속성 패널에서 너비/높이 직접 입력 시 격자 스냅 제거
- 문제: 속성 패널에서 너비/높이 입력 시 격자 시스템이 자동으로 값을 변경 - 원인: updateComponentProperty에서 size.width/height 변경 시 무조건 격자 스냅 적용 - 해결: 직접 입력 시에는 격자 스냅을 적용하지 않도록 로직 주석 처리 - 영향: - 속성 패널에서 원하는 크기로 자유롭게 설정 가능 - 드래그/리사이즈 시에는 별도 로직에서 격자 스냅 처리 - 디버깅 로그 제거
This commit is contained in:
parent
99deab05d8
commit
99468ca250
|
|
@ -527,36 +527,35 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
|
||||||
newComp.size = updatedSize;
|
newComp.size = updatedSize;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 크기 변경 시 격자 스냅 적용 (그룹 컴포넌트 제외)
|
// 크기 변경 시 격자 스냅 적용 제거 (직접 입력 시 불필요)
|
||||||
if (
|
// 드래그/리사이즈 시에는 별도 로직에서 처리됨
|
||||||
(path === "size.width" || path === "size.height") &&
|
// if (
|
||||||
prevLayout.gridSettings?.snapToGrid &&
|
// (path === "size.width" || path === "size.height") &&
|
||||||
newComp.type !== "group"
|
// prevLayout.gridSettings?.snapToGrid &&
|
||||||
) {
|
// newComp.type !== "group"
|
||||||
// 현재 해상도에 맞는 격자 정보로 스냅 적용
|
// ) {
|
||||||
const currentGridInfo = calculateGridInfo(screenResolution.width, screenResolution.height, {
|
// const currentGridInfo = calculateGridInfo(screenResolution.width, screenResolution.height, {
|
||||||
columns: prevLayout.gridSettings.columns,
|
// columns: prevLayout.gridSettings.columns,
|
||||||
gap: prevLayout.gridSettings.gap,
|
// gap: prevLayout.gridSettings.gap,
|
||||||
padding: prevLayout.gridSettings.padding,
|
// padding: prevLayout.gridSettings.padding,
|
||||||
snapToGrid: prevLayout.gridSettings.snapToGrid || false,
|
// snapToGrid: prevLayout.gridSettings.snapToGrid || false,
|
||||||
});
|
// });
|
||||||
const snappedSize = snapSizeToGrid(
|
// const snappedSize = snapSizeToGrid(
|
||||||
newComp.size,
|
// newComp.size,
|
||||||
currentGridInfo,
|
// currentGridInfo,
|
||||||
prevLayout.gridSettings as GridUtilSettings,
|
// prevLayout.gridSettings as GridUtilSettings,
|
||||||
);
|
// );
|
||||||
newComp.size = snappedSize;
|
// newComp.size = snappedSize;
|
||||||
|
//
|
||||||
// 크기 변경 시 gridColumns도 자동 조정
|
// const adjustedColumns = adjustGridColumnsFromSize(
|
||||||
const adjustedColumns = adjustGridColumnsFromSize(
|
// newComp,
|
||||||
newComp,
|
// currentGridInfo,
|
||||||
currentGridInfo,
|
// prevLayout.gridSettings as GridUtilSettings,
|
||||||
prevLayout.gridSettings as GridUtilSettings,
|
// );
|
||||||
);
|
// if (newComp.gridColumns !== adjustedColumns) {
|
||||||
if (newComp.gridColumns !== adjustedColumns) {
|
// newComp.gridColumns = adjustedColumns;
|
||||||
newComp.gridColumns = adjustedColumns;
|
// }
|
||||||
}
|
// }
|
||||||
}
|
|
||||||
|
|
||||||
// gridColumns 변경 시 크기를 격자에 맞게 자동 조정
|
// gridColumns 변경 시 크기를 격자에 맞게 자동 조정
|
||||||
if (path === "gridColumns" && prevLayout.gridSettings?.snapToGrid && newComp.type !== "group") {
|
if (path === "gridColumns" && prevLayout.gridSettings?.snapToGrid && newComp.type !== "group") {
|
||||||
|
|
|
||||||
|
|
@ -107,9 +107,9 @@ export function snapSizeToGrid(size: Size, gridInfo: GridInfo, gridSettings: Gri
|
||||||
const rowHeight = 10;
|
const rowHeight = 10;
|
||||||
const snappedHeight = Math.max(10, Math.round(size.height / rowHeight) * rowHeight);
|
const snappedHeight = Math.max(10, Math.round(size.height / rowHeight) * rowHeight);
|
||||||
|
|
||||||
console.log(
|
// console.log(
|
||||||
`📏 크기 스냅: ${size.width}px → ${snappedWidth}px (${gridColumns}컬럼, 컬럼너비:${columnWidth}px, 간격:${gap}px)`,
|
// `📏 크기 스냅: ${size.width}px → ${snappedWidth}px (${gridColumns}컬럼, 컬럼너비:${columnWidth}px, 간격:${gap}px)`,
|
||||||
);
|
// );
|
||||||
|
|
||||||
return {
|
return {
|
||||||
width: Math.max(columnWidth, snappedWidth),
|
width: Math.max(columnWidth, snappedWidth),
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue