What is the correct way to place a Kirigami.SearchField inside the window header?
Hello! I’m trying to do this:
https://lemmy.kde.social/pictrs/image/21993b82-655c-4cdd-a06e-14203f33f790.png
but I can’t seem to find a “good” way to do it:
if I just place it in the Kirigami.Page it is displayed, well, in the page, as in the image above.
<span style="color:#323232;">Kirigami.ApplicationWindow {
</span><span style="color:#323232;"> pageStack.initialPage: Kirigami.ScrollablePage {
</span><span style="color:#323232;"> Kirigami.SearchField { // TODO move in the page header
</span><span style="color:#323232;"> id: searchField
</span><span style="color:#323232;"> Layout.fillWidth: true
</span><span style="color:#323232;"> }
</span><span style="color:#323232;"> }
</span><span style="color:#323232;">}
</span>
if I place it in the header
of the window it is displayed before the actual header even:
<span style="color:#323232;">Kirigami.ApplicationWindow {
</span><span style="color:#323232;"> header: Kirigami.SearchField { // TODO move in the page header
</span><span style="color:#323232;"> id: searchField
</span><span style="color:#323232;"> Layout.fillWidth: true
</span><span style="color:#323232;"> }
</span><span style="color:#323232;"> pageStack.initialPage: Kirigami.ScrollablePage {
</span><span style="color:#323232;">
</span><span style="color:#323232;"> }
</span><span style="color:#323232;">}
</span>
https://lemmy.kde.social/pictrs/image/2fbb2c98-6335-4b8c-a0dd-de61e0290d69.png
if I place it just before the Page it goes inside the header, but all aligned to the top instead of nicely in the center:
<span style="color:#323232;">Kirigami.ApplicationWindow {
</span><span style="color:#323232;"> Kirigami.SearchField { // TODO move in the page header
</span><span style="color:#323232;"> id: searchField
</span><span style="color:#323232;"> Layout.fillWidth: true
</span><span style="color:#323232;"> }
</span><span style="color:#323232;"> pageStack.initialPage: Kirigami.ScrollablePage {
</span><span style="color:#323232;">
</span><span style="color:#323232;"> }
</span><span style="color:#323232;">}
</span>
https://lemmy.kde.social/pictrs/image/3eeb22b7-6347-4268-8f15-b25309a92c0d.png
what is the correct way of doing this?
thanks in advance!