StabilityMatrix/StabilityMatrix.Avalonia/Views/Inference/InferenceImageToImageView.axaml

<controls:UserControlBase
    x:Class="StabilityMatrix.Avalonia.Views.Inference.InferenceImageToImageView"
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:StabilityMatrix.Avalonia.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:dock="clr-namespace:StabilityMatrix.Avalonia.Controls.Dock"
    xmlns:icons="clr-namespace:Projektanker.Icons.Avalonia;assembly=Projektanker.Icons.Avalonia"
    xmlns:inference="clr-namespace:StabilityMatrix.Avalonia.ViewModels.Inference"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mocks="clr-namespace:StabilityMatrix.Avalonia.DesignData"
    xmlns:modelsInference="clr-namespace:StabilityMatrix.Avalonia.Models.Inference"
    xmlns:system="clr-namespace:System;assembly=System.Runtime"
    xmlns:ui="using:FluentAvalonia.UI.Controls"
    xmlns:vm="clr-namespace:StabilityMatrix.Avalonia.ViewModels"
    xmlns:vmInference="using:StabilityMatrix.Avalonia.ViewModels.Inference"
    d:DataContext="{x:Static mocks:DesignData.InferenceImageToImageViewModel}"
    d:DesignHeight="800"
    d:DesignWidth="1000"
    x:DataType="inference:InferenceImageToImageViewModel"
    Focusable="True"
    mc:Ignorable="d">

    <Grid Margin="2,0,2,8">
        <DockControl
            x:Name="Dock"
            InitializeFactory="True"
            InitializeLayout="True">
            <DockControl.Factory>
                <Factory />
            </DockControl.Factory>

            <RootDock
                x:Name="Root"
                DefaultDockable="{Binding #MainLayout}"
                Id="Root"
                IsCollapsable="False">

                <ProportionalDock
                    x:Name="MainLayout"
                    Id="MainLayout"
                    Orientation="Horizontal">

                    <!--  Left Pane  -->
                    <ToolDock
                        x:Name="ConfigPane"
                        Alignment="Left"
                        Id="ConfigPane"
                        Proportion="0.2">
                        <Tool
                            x:Name="ConfigTool"
                            Title="Config"
                            x:DataType="Tool"
                            CanClose="False"
                            Id="ConfigTool">
                            <controls:StackCard DataContext="{ReflectionBinding ElementName=Dock, Path=DataContext.StackCardViewModel}" Opacity="1" />
                        </Tool>
                    </ToolDock>

                    <ProportionalDockSplitter x:Name="Splitter1" Id="Splitter1" />

                    <!--  Prompt Pane  -->
                    <ProportionalDock
                        x:Name="CenterProportionalDock"
                        Id="CenterProportionalDock"
                        Orientation="Vertical">

                        <!--  Center Top (Image)  -->

                        <ToolDock
                            x:Name="ImagePane"
                            Alignment="Left"
                            Id="ImagePane"
                            Proportion="0.25">
                            <Tool
                                x:Name="ImageTool"
                                Title="Image"
                                x:DataType="Tool"
                                CanClose="False"
                                Id="ImageTool">

                                <!--  Prompt and buttons  -->
                                <Grid
                                    x:CompileBindings="False"
                                    DataContext="{Binding ElementName=Dock, Path=DataContext}"
                                    Opacity="1"
                                    RowDefinitions="*">
                                    <!--  Prompt card  -->
                                    <controls:SelectImageCard 
                                        x:CompileBindings="False" 
                                        DataContext="{Binding SelectImageCardViewModel}" />
                                </Grid>

                            </Tool>
                        </ToolDock>

                        <ProportionalDockSplitter />

                        <!--  Center Bottom (Prompt)  -->
                        <ToolDock
                            x:Name="PromptPane"
                            Alignment="Left"
                            Id="PromptPane"
                            Proportion="0.25">
                            <Tool
                                x:Name="PromptTool"
                                Title="Prompt"
                                x:DataType="Tool"
                                CanClose="False"
                                Id="PromptTool">

                                <!--  Prompt and buttons  -->
                                <Grid
                                    x:CompileBindings="False"
                                    DataContext="{Binding ElementName=Dock, Path=DataContext}"
                                    Opacity="1"
                                    RowDefinitions="*,Auto,Auto">
                                    <!--  Prompt card  -->
                                    <controls:PromptCard DataContext="{Binding PromptCardViewModel}" />

                                    <!--  Generate Buttons  -->
                                    <StackPanel Grid.Row="2" Margin="0,6,0,0">
                                        <controls:Card Padding="8">
                                            <Grid
                                                HorizontalAlignment="Center"
                                                ColumnDefinitions="Auto,*,Auto"
                                                RowDefinitions="Auto,*">
                                                <Grid.Styles>
                                                    <Style Selector="Button">
                                                        <Setter Property="MinHeight" Value="32" />
                                                    </Style>
                                                </Grid.Styles>
                                                <Button
                                                    Grid.Row="1"
                                                    Margin="4,0"
                                                    Padding="12,8"
                                                    HorizontalAlignment="Left"
                                                    icons:Attached.Icon="fa-solid fa-magnifying-glass-plus"
                                                    Classes="transparent"
                                                    Command="{Binding GenerateImageCommand}"
                                                    CommandParameter="{x:Static modelsInference:GenerateFlags.HiresFixAndUseCurrentSeed}"
                                                    ToolTip.Tip="Generate with Hires Scaling" />

                                                <!--  Main Generate Button  -->
                                                <Button
                                                    x:Name="GenerateButton"
                                                    Grid.Row="1"
                                                    Grid.Column="1"
                                                    Width="130"
                                                    HorizontalAlignment="Stretch"
                                                    Classes="accent"
                                                    ToolTip.Tip="{Binding $self.HotKey}"
                                                    HotKey="Ctrl+Enter"
                                                    Command="{Binding GenerateImageCommand}"
                                                    CommandParameter="{x:Static modelsInference:GenerateFlags.None}"
                                                    IsVisible="{Binding !GenerateImageCommand.CanBeCanceled}">
                                                    <Panel>
                                                        <TextBlock IsVisible="{Binding #GenerateButton.IsEnabled}" Text="Generate Image" />
                                                        <controls:ProgressRing IsIndeterminate="True" IsVisible="{Binding !#GenerateButton.IsEnabled}" />
                                                    </Panel>
                                                </Button>
                                                <!--  Cancel Button  -->
                                                <Button
                                                    x:Name="CancelButton"
                                                    Grid.Row="1"
                                                    Grid.Column="1"
                                                    Width="130"
                                                    HorizontalAlignment="Stretch"
                                                    icons:Attached.Icon="fa-solid fa-stop"
                                                    Command="{Binding GenerateImageCancelCommand}"
                                                    IsVisible="{Binding GenerateImageCommand.CanBeCanceled}" />

                                                <Button
                                                    Grid.Row="1"
                                                    Grid.Column="2"
                                                    Margin="4,0"
                                                    Padding="12,8"
                                                    HorizontalAlignment="Left"
                                                    icons:Attached.Icon="fa-solid fa-repeat"
                                                    Classes="transparent"
                                                    Command="{Binding GenerateImageCommand}"
                                                    CommandParameter="{x:Static modelsInference:GenerateFlags.UseCurrentSeed}"
                                                    ToolTip.Tip="Generate with current seed" />
                                            </Grid>
                                        </controls:Card>
                                    </StackPanel>
                                </Grid>

                            </Tool>
                        </ToolDock>

                    </ProportionalDock>


                    <ProportionalDockSplitter x:Name="Splitter2" Id="Splitter2" />

                    <!--  Middle Right Pane  -->
                    <ToolDock
                        x:Name="ImageGalleryPane"
                        Alignment="Right"
                        Id="ImageGalleryPane"
                        Proportion="0.35">
                        <Tool
                            x:Name="ImageGalleryTool"
                            Title="Image Output"
                            x:DataType="Tool"
                            CanClose="False"
                            Id="ImageGalleryTool">

                            <Grid x:CompileBindings="False" DataContext="{Binding ElementName=Dock, Path=DataContext}">
                                <controls:ImageGalleryCard Grid.Row="0" DataContext="{Binding ImageGalleryCardViewModel}" />

                                <StackPanel
                                    Margin="2,1,2,4"
                                    VerticalAlignment="Top"
                                    DataContext="{Binding OutputProgress}"
                                    Spacing="4">
                                    <ProgressBar
                                        IsIndeterminate="{Binding IsIndeterminate}"
                                        IsVisible="{Binding IsProgressVisible}"
                                        Maximum="{Binding Maximum}"
                                        Value="{Binding Value}" />

                                    <TextBlock
                                        Margin="0,10,0,0"
                                        IsVisible="{Binding IsTextVisible}"
                                        Text="{Binding Text}"
                                        TextAlignment="Center" />
                                </StackPanel>
                            </Grid>
                        </Tool>
                    </ToolDock>

                    <ProportionalDockSplitter x:Name="Splitter3" Id="Splitter3" />

                    <!--  Right Pane  -->
                    <ToolDock
                        x:Name="ImageFolderPane"
                        Alignment="Right"
                        Id="ImageFolderPane"
                        Proportion="0.1">
                        <Tool
                            x:Name="ImageFolderTool"
                            Title="Gallery"
                            x:DataType="Tool"
                            CanClose="False"
                            Id="ImageFolderTool">

                            <Grid x:CompileBindings="False" DataContext="{Binding ElementName=Dock, Path=DataContext}">
                                <controls:ImageFolderCard DataContext="{Binding ImageFolderCardViewModel}" />
                            </Grid>
                        </Tool>
                    </ToolDock>

                </ProportionalDock>
            </RootDock>

        </DockControl>
    </Grid>
</controls:UserControlBase>