kamp/IOPaint
1
0
Fork 0
Code Issues Pull Requests Releases 1 Activity

prevent croper position between show/hidden

Browse Source
This commit is contained in:
Qing 2022-12-11 19:38:20 +08:00
parent 203f2bc9c7
commit e4664e2d58
2 changed files with 16 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
lama_cleaner/app/src/components/Croper/Croper.tsx
View File

@ -30,6 +30,7 @@ interface Props {
scale: number scale: number
minHeight: number minHeight: number
minWidth: number minWidth: number
show: boolean
} }
const clamp = ( const clamp = (
@ -66,7 +67,7 @@ const clamp = (
} }
const Croper = (props: Props) => { const Croper = (props: Props) => {
const { minHeight, minWidth, maxHeight, maxWidth, scale } = props const { minHeight, minWidth, maxHeight, maxWidth, scale, show } = props
const [x, setX] = useRecoilState(croperX) const [x, setX] = useRecoilState(croperX)
const [y, setY] = useRecoilState(croperY) const [y, setY] = useRecoilState(croperY)
const [height, setHeight] = useRecoilState(croperHeight) const [height, setHeight] = useRecoilState(croperHeight)
@ -79,7 +80,7 @@ const Croper = (props: Props) => {
useEffect(() => { useEffect(() => {
setX(Math.round((maxWidth - 512) / 2)) setX(Math.round((maxWidth - 512) / 2))
setY(Math.round((maxHeight - 512) / 2)) setY(Math.round((maxHeight - 512) / 2))
}, [maxHeight, maxWidth, minHeight, minWidth]) }, [maxHeight, maxWidth])
const [evData, setEVData] = useState<EVData>({ const [evData, setEVData] = useState<EVData>({
initX: 0, initX: 0,
@ -391,7 +392,10 @@ const Croper = (props: Props) => {
} }
return ( return (
<div className="croper-wrapper"> <div
className="croper-wrapper"
style={{ visibility: show ? 'visible' : 'hidden' }}
>
<div className="croper" style={{ height, width, left: x, top: y }}> <div className="croper" style={{ height, width, left: x, top: y }}>
{createBorder()} {createBorder()}
{createInfoBar()} {createInfoBar()}

6
lama_cleaner/app/src/components/Editor/Editor.tsx
View File

@ -436,6 +436,7 @@ export default function Editor() {
useEffect(() => { useEffect(() => {
emitter.on(EVENT_CUSTOM_MASK, (data: any) => { emitter.on(EVENT_CUSTOM_MASK, (data: any) => {
// TODO: not work with paint by example
runInpainting(false, data.mask) runInpainting(false, data.mask)
}) })
@ -1339,17 +1340,14 @@ export default function Editor() {
</div> </div>
</div> </div>
{(isSD || isPaintByExample) && settings.showCroper ? (
<Croper <Croper
maxHeight={original.naturalHeight} maxHeight={original.naturalHeight}
maxWidth={original.naturalWidth} maxWidth={original.naturalWidth}
minHeight={Math.min(256, original.naturalHeight)} minHeight={Math.min(256, original.naturalHeight)}
minWidth={Math.min(256, original.naturalWidth)} minWidth={Math.min(256, original.naturalWidth)}
scale={scale} scale={scale}
show={(isSD || isPaintByExample) && settings.showCroper}
/> />
) : (
<></>
)}
{isInteractiveSeg ? <InteractiveSeg /> : <></>} {isInteractiveSeg ? <InteractiveSeg /> : <></>}
</TransformComponent> </TransformComponent>