74 lines
6.0 KiB
Markdown
74 lines
6.0 KiB
Markdown
---
|
|
name: ShareX-indeling editor
|
|
overview: "Een tweede editor-indeling toevoegen in de stijl van ShareX: bovenaan de bewerkgereedschappen met daaronder de eigenschappenbalk, onderaan een aparte balk met zoom en de opslag-, upload- en kopieerknoppen. De indeling is te kiezen in Instellingen (tab Editor) en via het rechtsklikmenu van de werkbalk. Uitbrengen als versie 1.1.5."
|
|
todos:
|
|
- id: settings
|
|
content: EditorLayout-enum, EditorLayout- en SplitToolbarOrder-instelling toevoegen aan AppSettings
|
|
status: completed
|
|
- id: xaml
|
|
content: ActionBar met ActionItems (ToolbarPanel) toevoegen aan EditorWindow.xaml
|
|
status: completed
|
|
- id: code
|
|
content: "Werkbalkcode ombouwen: items verdelen over twee panelen, labels/vergrendelen/verbergen/volgorde/omwisselen per paneel, menu Indeling, bijsnijden, OnActivated"
|
|
status: completed
|
|
- id: settingsui
|
|
content: Radioknoppen voor de indeling in de Editor-tab van Instellingen plus herstellen naar standaard
|
|
status: completed
|
|
- id: version
|
|
content: Versie 1.1.5 in csproj, build.ps1 en Kniip.iss en een CHANGELOG-regel
|
|
status: completed
|
|
- id: verify
|
|
content: Bouwen en beide indelingen handmatig testen
|
|
status: completed
|
|
isProject: false
|
|
---
|
|
|
|
# ShareX-achtige editor-indeling (versie 1.1.5)
|
|
|
|
## Indeling
|
|
|
|
- **Eén werkbalk** (standaard, zoals nu): alles in `ToolbarItems`, positie Boven/Onder/Links/Rechts blijft werken.
|
|
- **Gesplitst (zoals ShareX)**:
|
|
- Boven, gecentreerd: Selecteren, Rechthoek ... Vervagen, Bijsnijden, met daarnaast Wissen, Ongedaan maken, Opnieuw en Verwijderen. Direct daaronder de bestaande eigenschappenbalk `PropsBar` (die al gecentreerd is).
|
|
- Onder, boven de statusbalk: links Nieuw en Screencast, in het midden Uitzoomen / 100% / Inzoomen, rechts Instellingen, Opslaan, Uploaden en Kopiëren (met tekstlabels, want daar is ruimte).
|
|
|
|
```mermaid
|
|
flowchart TB
|
|
topBar["Boven: gereedschappen + ongedaan maken"]
|
|
props["Eigenschappenbalk: kleur, dikte, lijnstijl"]
|
|
canvas["Canvas"]
|
|
bottomBar["Onder: Nieuw, Screencast | Zoom | Instellingen, Opslaan, Uploaden, Kopiëren"]
|
|
status["Statusbalk"]
|
|
topBar --> props --> canvas --> bottomBar --> status
|
|
```
|
|
|
|
## Wijzigingen
|
|
|
|
**[src/Kniip/Settings/AppSettings.cs](src/Kniip/Settings/AppSettings.cs)**
|
|
- Nieuwe enum `EditorLayout { Single, Split }` en `public EditorLayout EditorLayout { get; set; } = EditorLayout.Single;`
|
|
- Aparte `List<string> SplitToolbarOrder`, zodat versleepte volgordes van beide indelingen elkaar niet overschrijven. `ToolbarHidden` blijft gedeeld.
|
|
|
|
**[src/Kniip/Editor/EditorWindow.xaml](src/Kniip/Editor/EditorWindow.xaml)**
|
|
- Een tweede `Border x:Name="ActionBar" DockPanel.Dock="Bottom"` (na de statusbalk gedeclareerd, dus erboven) met `local:ToolbarPanel x:Name="ActionItems"`, dezelfde `ContextMenuOpening`- en `OrderChanged`-handlers en standaard `Collapsed`.
|
|
- De knoppen zelf blijven op één plek in de XAML staan; de code verdeelt ze over de panelen.
|
|
|
|
**[src/Kniip/Editor/EditorWindow.xaml.cs](src/Kniip/Editor/EditorWindow.xaml.cs)** (rond regels 141-362 voor de werkbalk)
|
|
- In `InitializeToolbar` alle items één keer in een dictionary `_toolbarItems` (id naar element) vastleggen, plus een vaste set id's die in de gesplitste indeling onderaan komen: `New, Screencast, Spacer, ZoomOut, Zoom, ZoomIn, Spacer2, Settings, Save, Upload, Copy` (plus de bijbehorende scheidingslijnen).
|
|
- `ApplyToolbarOrder` ombouwen tot `ApplyToolbarLayout()`: beide panelen leegmaken en de items volgens de opgeslagen volgorde (`ToolbarOrder` of `SplitToolbarOrder`) verdelen over `ToolbarItems` en `ActionItems`. De logica voor nieuwe items die na hun standaardvoorganger komen, blijft hetzelfde. In de gesplitste indeling krijgt het bovenste paneel `HorizontalAlignment=Center`, `Toolbar` vast `Dock.Top` en wordt `ActionBar` getoond.
|
|
- Alle plekken die nu `ToolbarItems.Items` gebruiken, laten werken op beide panelen: `SelectTool` (regel 368), "Knoppen tonen", `ResetToolbar`, de vergrendeling (`IsLocked` op beide panelen, achtergrondkleur op beide balken) en `OrderChanged` (de volgorde van boven + onder samen opslaan in `SplitToolbarOrder`).
|
|
- `UpdateToolbarLayout` en `SetActionLabelsVisible` per paneel laten rekenen, zodat de labels op de onderbalk zichtbaar blijven, ook als de bovenbalk vol is. De lus op regel 236 stopt bij het `ToolbarPanel` waarin het label staat, in plaats van alleen bij `ToolbarItems`.
|
|
- `SwapToolbarGroups` werkt op het paneel waarop is rechtsgeklikt.
|
|
- Rechtsklikmenu: een nieuw submenu "Indeling" met "Eén werkbalk" en "Gesplitst (zoals ShareX)". "Positie" alleen tonen bij Eén werkbalk.
|
|
- Op regel 935, waar `Toolbar` tijdens bijsnijden wordt verborgen, ook `ActionBar` verbergen (alleen als de gesplitste indeling aanstaat).
|
|
- In `OnActivated` (regel 1508) `ApplyToolbarLayout()` aanroepen als de indeling is veranderd, zodat een wijziging in Instellingen meteen zichtbaar is in een open editor (zoals dat nu ook gebeurt met `ApplySaveButton`).
|
|
|
|
**[src/Kniip/Settings/SettingsWindow.xaml](src/Kniip/Settings/SettingsWindow.xaml) en [.xaml.cs](src/Kniip/Settings/SettingsWindow.xaml.cs)**
|
|
- In de tab Editor (regel 252) een kopje "Werkbalk" met twee radioknoppen `LayoutSingleRadio` / `LayoutSplitRadio` en een korte uitleg, op dezelfde manier geladen en opgeslagen als `SaveOnlyRadio` / `SaveAndCopyRadio`.
|
|
- Bij het herstellen van de standaardinstellingen (regel 466) ook `EditorLayout` en `SplitToolbarOrder` meenemen.
|
|
|
|
**Versie 1.1.5**
|
|
- `<Version>1.1.5</Version>` in [src/Kniip/Kniip.csproj](src/Kniip/Kniip.csproj), de standaardwaarde in [build.ps1](build.ps1) (regel 16) en `#define AppVersion` in [installer/Kniip.iss](installer/Kniip.iss).
|
|
- In [CHANGELOG.md](CHANGELOG.md) bovenaan `## 1.1.5 - 2026-11-09`, onder `### Nieuw`: **Werkbalkindeling zoals ShareX.**
|
|
|
|
## Controle
|
|
- Bouwen met `build.ps1`, daarna beide indelingen uitproberen: wisselen via Instellingen en via het rechtsklikmenu, knoppen verslepen en verbergen, bijsnijden, een smal venster (de balken moeten netjes doorlopen naar een nieuwe regel) en "Standaard herstellen". |