mirror of
https://github.com/penpot/penpot.git
synced 2025-03-18 10:41:29 -05:00
🐛 Fix problem with auto-width and transforms
This commit is contained in:
parent
8ffe023d3e
commit
1fe1a352c3
7 changed files with 40 additions and 50 deletions
|
@ -6,7 +6,6 @@
|
|||
|
||||
(ns app.common.geom.shapes.constraints
|
||||
(:require
|
||||
[app.common.geom.matrix :as gmt]
|
||||
[app.common.geom.point :as gpt]
|
||||
[app.common.geom.shapes.intersect :as gsi]
|
||||
[app.common.geom.shapes.points :as gpo]
|
||||
|
@ -184,7 +183,7 @@
|
|||
(ctm/move-modifiers (displacement end-before end-after))))
|
||||
|
||||
(defmethod constraint-modifier :fixed
|
||||
[_ axis child-points-before parent-points-before child-points-after parent-points-after {:keys [transform transform-inverse]} modifiers]
|
||||
[_ axis child-points-before parent-points-before child-points-after parent-points-after]
|
||||
(let [;; Same as constraint end
|
||||
end-before (end-vector axis child-points-before parent-points-before)
|
||||
end-after (end-vector axis child-points-after parent-points-after)
|
||||
|
@ -205,14 +204,11 @@
|
|||
|
||||
resize-origin (gpo/origin child-points-after)
|
||||
|
||||
modif-transform (ctm/modifiers->transform modifiers)
|
||||
modif-transform-inverse (gmt/inverse modif-transform)
|
||||
resize-transform (gmt/multiply modif-transform transform)
|
||||
resize-transform-inverse (gmt/multiply transform-inverse modif-transform-inverse)
|
||||
[_ transform transform-inverse] (gtr/calculate-geometry parent-points-after)
|
||||
|
||||
resize-vector (get-scale axis scale)]
|
||||
(-> (ctm/empty)
|
||||
(ctm/resize resize-vector resize-origin resize-transform resize-transform-inverse)
|
||||
(ctm/resize resize-vector resize-origin transform transform-inverse)
|
||||
(ctm/move disp-start))))
|
||||
|
||||
(defmethod constraint-modifier :center
|
||||
|
@ -253,7 +249,6 @@
|
|||
(defn normalize-modifiers
|
||||
"Before aplying constraints we need to remove the deformation caused by the resizing of the parent"
|
||||
[constraints-h constraints-v modifiers
|
||||
{:keys [transform transform-inverse] :as parent}
|
||||
child-bounds transformed-child-bounds parent-bounds transformed-parent-bounds]
|
||||
|
||||
(let [child-bb-before (gpo/parent-coords-bounds child-bounds parent-bounds)
|
||||
|
@ -268,17 +263,11 @@
|
|||
(/ (gpo/height-points child-bb-before) (gpo/height-points child-bb-after)))
|
||||
|
||||
resize-vector (gpt/point scale-x scale-y)
|
||||
modif-transform (ctm/modifiers->transform modifiers)
|
||||
modif-transform-inverse (gmt/inverse modif-transform)
|
||||
resize-transform (gmt/multiply modif-transform transform)
|
||||
resize-transform-inverse (gmt/multiply transform-inverse modif-transform-inverse)
|
||||
resize-origin (gpo/origin transformed-child-bounds)]
|
||||
resize-origin (gpo/origin transformed-child-bounds)
|
||||
[_ transform transform-inverse] (gtr/calculate-geometry transformed-parent-bounds)]
|
||||
|
||||
(-> modifiers
|
||||
(ctm/resize
|
||||
resize-vector
|
||||
resize-origin
|
||||
resize-transform
|
||||
resize-transform-inverse))))
|
||||
(ctm/resize resize-vector resize-origin transform transform-inverse))))
|
||||
|
||||
(defn calc-child-modifiers
|
||||
[parent child modifiers ignore-constraints child-bounds parent-bounds transformed-parent-bounds]
|
||||
|
@ -314,8 +303,7 @@
|
|||
|
||||
modifiers (ctm/select-child modifiers)
|
||||
transformed-child-bounds (gtr/transform-bounds child-bounds modifiers)
|
||||
modifiers (normalize-modifiers constraints-h constraints-v
|
||||
modifiers parent
|
||||
modifiers (normalize-modifiers constraints-h constraints-v modifiers
|
||||
child-bounds transformed-child-bounds parent-bounds transformed-parent-bounds)
|
||||
transformed-child-bounds (gtr/transform-bounds child-bounds modifiers)
|
||||
|
||||
|
@ -324,13 +312,11 @@
|
|||
|
||||
modifiers-h (constraint-modifier (constraints-h const->type+axis) :x
|
||||
child-points-before parent-bounds
|
||||
child-points-after transformed-parent-bounds
|
||||
parent modifiers)
|
||||
child-points-after transformed-parent-bounds)
|
||||
|
||||
modifiers-v (constraint-modifier (constraints-v const->type+axis) :y
|
||||
child-points-before parent-bounds
|
||||
child-points-after transformed-parent-bounds
|
||||
parent modifiers)]
|
||||
child-points-after transformed-parent-bounds)]
|
||||
(-> modifiers
|
||||
(ctm/add-modifiers modifiers-h)
|
||||
(ctm/add-modifiers modifiers-v))))))
|
||||
|
|
|
@ -9,12 +9,15 @@
|
|||
[app.common.geom.point :as gpt]
|
||||
[app.common.geom.shapes.flex-layout.positions :as fpo]
|
||||
[app.common.geom.shapes.points :as gpo]
|
||||
[app.common.geom.shapes.transforms :as gtr]
|
||||
[app.common.types.modifiers :as ctm]
|
||||
[app.common.types.shape.layout :as ctl]))
|
||||
|
||||
(defn calc-fill-width-data
|
||||
"Calculates the size and modifiers for the width of an auto-fill child"
|
||||
[{:keys [transform transform-inverse] :as parent}
|
||||
[parent
|
||||
transform
|
||||
transform-inverse
|
||||
child
|
||||
child-origin child-width
|
||||
{:keys [children-data line-width] :as layout-data}]
|
||||
|
@ -36,7 +39,8 @@
|
|||
|
||||
(defn calc-fill-height-data
|
||||
"Calculates the size and modifiers for the height of an auto-fill child"
|
||||
[{:keys [transform transform-inverse] :as parent}
|
||||
[parent
|
||||
transform transform-inverse
|
||||
child
|
||||
child-origin child-height
|
||||
{:keys [children-data line-height] :as layout-data}]
|
||||
|
@ -58,13 +62,17 @@
|
|||
|
||||
(defn layout-child-modifiers
|
||||
"Calculates the modifiers for the layout"
|
||||
[parent child child-bounds layout-line]
|
||||
[parent parent-bounds child child-bounds layout-line]
|
||||
(let [child-origin (gpo/origin child-bounds)
|
||||
child-width (gpo/width-points child-bounds)
|
||||
child-height (gpo/height-points child-bounds)
|
||||
|
||||
fill-width (when (ctl/fill-width? child) (calc-fill-width-data parent child child-origin child-width layout-line))
|
||||
fill-height (when (ctl/fill-height? child) (calc-fill-height-data parent child child-origin child-height layout-line))
|
||||
[_ transform transform-inverse]
|
||||
(when (or (ctl/fill-width? child) (ctl/fill-width? child))
|
||||
(gtr/calculate-geometry @parent-bounds))
|
||||
|
||||
fill-width (when (ctl/fill-width? child) (calc-fill-width-data parent transform transform-inverse child child-origin child-width layout-line))
|
||||
fill-height (when (ctl/fill-height? child) (calc-fill-height-data parent transform transform-inverse child child-origin child-height layout-line))
|
||||
|
||||
child-width (or (:width fill-width) child-width)
|
||||
child-height (or (:height fill-height) child-height)
|
||||
|
@ -78,5 +86,4 @@
|
|||
(cond-> fill-width (ctm/add-modifiers (:modifiers fill-width)))
|
||||
(cond-> fill-height (ctm/add-modifiers (:modifiers fill-height)))
|
||||
(ctm/move move-vec))]
|
||||
|
||||
[modifiers layout-line]))
|
||||
|
|
|
@ -160,7 +160,7 @@
|
|||
|
||||
(set-child-modifiers [[layout-line modif-tree] [child-bounds child]]
|
||||
(let [[modifiers layout-line]
|
||||
(gcl/layout-child-modifiers parent child child-bounds layout-line)
|
||||
(gcl/layout-child-modifiers parent transformed-parent-bounds child child-bounds layout-line)
|
||||
|
||||
modif-tree
|
||||
(cond-> modif-tree
|
||||
|
|
|
@ -12,16 +12,19 @@
|
|||
[app.common.geom.shapes.common :as gco]
|
||||
[app.common.geom.shapes.points :as gpo]
|
||||
[app.common.geom.shapes.rect :as gpr]
|
||||
[app.common.geom.shapes.transforms :as gtr]
|
||||
[app.common.math :as mth]
|
||||
[app.common.pages.helpers :as cph]
|
||||
[app.common.types.modifiers :as ctm]))
|
||||
|
||||
(defn size-pixel-precision
|
||||
[modifiers {:keys [transform transform-inverse] :as shape} points]
|
||||
[modifiers shape points]
|
||||
(let [origin (gpo/origin points)
|
||||
curr-width (gpo/width-points points)
|
||||
curr-height (gpo/height-points points)
|
||||
|
||||
[_ transform transform-inverse] (gtr/calculate-geometry points)
|
||||
|
||||
path? (cph/path-shape? shape)
|
||||
vertical-line? (and path? (<= curr-width 0.01))
|
||||
horizontal-line? (and path? (<= curr-height 0.01))
|
||||
|
|
|
@ -304,6 +304,11 @@
|
|||
(-> (or modifiers (empty))
|
||||
(update :structure-child conj (change-property-op property value))))
|
||||
|
||||
(defn change-parent-property
|
||||
[modifiers property value]
|
||||
(-> (or modifiers (empty))
|
||||
(update :structure-parent conj (change-property-op property value))))
|
||||
|
||||
(defn- concat-geometry
|
||||
[operations other merge?]
|
||||
|
||||
|
|
|
@ -103,7 +103,7 @@
|
|||
(defn start-resize
|
||||
"Enter mouse resize mode, until mouse button is released."
|
||||
[handler ids shape]
|
||||
(letfn [(resize [shape objects initial layout [point lock? center? point-snap]]
|
||||
(letfn [(resize [shape initial layout [point lock? center? point-snap]]
|
||||
(let [{:keys [width height]} (:selrect shape)
|
||||
{:keys [rotation]} shape
|
||||
|
||||
|
@ -169,22 +169,11 @@
|
|||
|
||||
;; When the horizontal/vertical scale a flex children with auto/fill
|
||||
;; we change it too fixed
|
||||
layout? (ctl/layout? shape)
|
||||
layout-child? (ctl/layout-child? objects shape)
|
||||
auto-width? (ctl/auto-width? shape)
|
||||
fill-width? (ctl/fill-width? shape)
|
||||
auto-height? (ctl/auto-height? shape)
|
||||
fill-height? (ctl/fill-height? shape)
|
||||
|
||||
set-fix-width?
|
||||
(and (not (mth/close? (:x scalev) 1))
|
||||
(or (and (or layout? layout-child?) auto-width?)
|
||||
(and layout-child? fill-width?)))
|
||||
(not (mth/close? (:x scalev) 1))
|
||||
|
||||
set-fix-height?
|
||||
(and (not (mth/close? (:y scalev) 1))
|
||||
(or (and (or layout? layout-child?) auto-height?)
|
||||
(and layout-child? fill-height?)))
|
||||
(not (mth/close? (:y scalev) 1))
|
||||
|
||||
modifiers
|
||||
(-> (ctm/empty)
|
||||
|
@ -193,10 +182,10 @@
|
|||
(ctm/resize scalev resize-origin shape-transform shape-transform-inverse)
|
||||
|
||||
(cond-> set-fix-width?
|
||||
(ctm/change-property :layout-item-h-sizing :fix))
|
||||
(ctm/change-parent-property :layout-item-h-sizing :fix))
|
||||
|
||||
(cond-> set-fix-height?
|
||||
(ctm/change-property :layout-item-v-sizing :fix))
|
||||
(ctm/change-parent-property :layout-item-v-sizing :fix))
|
||||
|
||||
(cond-> scale-text
|
||||
(ctm/scale-content (:x scalev))))
|
||||
|
@ -234,7 +223,7 @@
|
|||
(rx/switch-map (fn [[point _ _ :as current]]
|
||||
(->> (snap/closest-snap-point page-id resizing-shapes objects layout zoom focus point)
|
||||
(rx/map #(conj current %)))))
|
||||
(rx/mapcat (partial resize shape objects initial-position layout))
|
||||
(rx/mapcat (partial resize shape initial-position layout))
|
||||
(rx/take-until stoper))
|
||||
(rx/of (dwm/apply-modifiers)
|
||||
(finish-transform))))))))
|
||||
|
|
|
@ -143,7 +143,7 @@
|
|||
(get-layout-flex-icon :align-self align is-col?)])]))
|
||||
|
||||
(mf/defc layout-item-menu
|
||||
{::mf/wrap [#(mf/memo' % (mf/check-props ["ids" "values" "type"]))]}
|
||||
{::mf/wrap [#(mf/memo' % (mf/check-props ["ids" "values" "type" "is-layout-child?"]))]}
|
||||
[{:keys [ids values is-layout-child? is-layout-container?] :as props}]
|
||||
|
||||
(let [open? (mf/use-state false)
|
||||
|
|
Loading…
Add table
Reference in a new issue