window: First work for drag overlay visuals

Issue #59

Part-of: <https://gitlab.gnome.org/GNOME/loupe/-/merge_requests/258>
This commit is contained in:
qwel 2023-06-10 23:43:09 +02:00 • committed by Sophie Herold
parent 597f581980
commit 3111efdd94
3 changed files with 114 additions and 35 deletions

View file

@ -168,46 +168,53 @@
<property name="locked">True</property>
<property name="reveal-flap" bind-source="properties_button" bind-property="active" bind-flags="bidirectional|sync-create"/>
<property name="content">
<object class="GtkStack" id="stack">
<property name="visible-child">status_page</property>
<property name="vexpand">True</property>
<child>
<object class="AdwStatusPage" id="status_page">
<property name="title" translatable="yes">View Images</property>
<property name="description" translatable="yes">Drag and drop images here</property>
<child>
<object class="GtkButton">
<property name="halign">center</property>
<property name="label" translatable="yes">_Open Files…</property>
<property name="use-underline">True</property>
<property name="action-name">win.open</property>
<style>
<class name="pill"/>
<class name="suggested-action"/>
</style>
</object>
</child>
</object>
</child>
<child>
<object class="LpImageView" id="image_view">
<child>
<object class="GtkGestureClick" id="forward_click_gesture">
<property name="button">9</property>
</object>
</child>
<child>
<object class="GtkGestureClick" id="backward_click_gesture">
<property name="button">8</property>
</object>
</child>
</object>
</child>
<object class="GtkOverlay" id="drop_area_overlay">
<style>
<class name="custom-drag-n-drop-highlight"/>
</style>
<child>
<object class="GtkDropTarget" id="drop_target">
<property name="actions">copy</property>
</object>
</child>
<child>
<object class="GtkStack" id="stack">
<property name="visible-child">status_page</property>
<property name="vexpand">True</property>
<child>
<object class="AdwStatusPage" id="status_page">
<property name="title" translatable="yes">View Images</property>
<property name="description" translatable="yes">Drag and drop images here</property>
<child>
<object class="GtkButton">
<property name="halign">center</property>
<property name="label" translatable="yes">_Open Files…</property>
<property name="use-underline">True</property>
<property name="action-name">win.open</property>
<style>
<class name="pill"/>
<class name="suggested-action"/>
</style>
</object>
</child>
</object>
</child>
<child>
<object class="LpImageView" id="image_view">
<child>
<object class="GtkGestureClick" id="forward_click_gesture">
<property name="button">9</property>
</object>
</child>
<child>
<object class="GtkGestureClick" id="backward_click_gesture">
<property name="button">8</property>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</property>
<property name="separator">

View file

@ -29,6 +29,15 @@ row.property label.subtitle {
box-shadow: 0 0 10px rgba(0, 0, 0, 200);
}
.custom-drag-n-drop-highlight {
box-shadow: none;
}
.lp-dragging-area-highlight {
border-radius: 8px;
background-color: alpha(@accent_color, 0.35);
border: 2px @accent_color solid;
}
lpprintpreview {
background-color: rgb(240, 240, 240);
border-radius: 4px;