StabilityMatrix/StabilityMatrix.Avalonia/Views/InferenceTextToImageView.axaml

<controls:UserControlBase
    x:Class="StabilityMatrix.Avalonia.Views.InferenceTextToImageView"
    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:icons="clr-namespace:Projektanker.Icons.Avalonia;assembly=Projektanker.Icons.Avalonia"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mocks="clr-namespace:StabilityMatrix.Avalonia.DesignData"
    xmlns:vmInference="using:StabilityMatrix.Avalonia.ViewModels.Inference"
    x:Name="RootControl"
    d:DataContext="{x:Static mocks:DesignData.InferenceTextToImageViewModel}"
    d:DesignHeight="800"
    d:DesignWidth="1000"
    x:DataType="vmInference:InferenceTextToImageViewModel"
    Focusable="True"
    mc:Ignorable="d">

    <controls:UserControlBase.Styles>

        <!--  Default grid splitter style  -->
        <Style Selector="GridSplitter">
            <Setter Property="Opacity" Value="0.6" />
            <Setter Property="Background" Value="{DynamicResource ScrollBarTrackStroke}" />
            <!--<Setter Property="Background" Value="{DynamicResource ScrollBarTrackStroke}" />-->
            <Setter Property="BorderThickness" Value="6" />
            <Setter Property="CornerRadius" Value="4" />
        </Style>
        
        <!-- Remove accent color from active dock bar -->
        <Style Selector="ToolChromeControl:active /template/ Grid#PART_Grip">
            <Setter Property="Background" Value="Transparent" />
        </Style>

    </controls:UserControlBase.Styles>

    <Grid>
        <DockControl
            x:Name="Dock"
            InitializeFactory="True"
            InitializeLayout="True">
            <DockControl.Factory>
                <Factory />
            </DockControl.Factory>

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

                <!--  Windows  -->
                <!--<RootDock.Windows>
                    <DockWindow
                        x:Name="DockWindow"
                        Width="250"
                        Height="400"
                        Id="DockWindow"
                        Topmost="True"
                        X="281"
                        Y="233">
                        <RootDock ActiveDockable="{Binding #ToolDock}" Window="{Binding #DockWindow}">
                            <ToolDock x:Name="ToolDock">
                                <Tool
                                    x:Name="ToolWindow"
                                    Title="Tool Window"
                                    x:DataType="Tool"
                                    Id="ToolWindow">
                                    <TextBlock Text="{Binding Title}" />
                                </Tool>
                            </ToolDock>
                        </RootDock>
                    </DockWindow>
                </RootDock.Windows>-->

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

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

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

                    <!--  Prompt Pane  -->
                    <ToolDock
                        x:Name="PromptPane"
                        Alignment="Right"
                        Id="PromptPane"
                        Proportion="0.3">
                        <Tool
                            x:Name="PromptTool"
                            Title="Prompt"
                            x:DataType="Tool"
                            Id="PromptTool"
                            CanClose="False">
                            
                            <!--  Prompt and buttons  -->
                            <Grid
                                Opacity="1"
                                x:CompileBindings="False"
                                DataContext="{Binding ElementName=Dock, Path=DataContext}"
                                RowDefinitions="*,Auto,Auto">
                                <!--  Prompt card  -->
                                <controls:PromptCard
                                    DataContext="{Binding PromptCardViewModel}" />

                                <!-- Seed Card -->
                                <controls:SeedCard 
                                    Grid.Row="1"
                                    Margin="0,6,0,0"
                                    DataContext="{Binding SeedCardViewModel}"/>
                                
                                <!--  Generate Buttons  -->
                                <StackPanel Grid.Row="2" Margin="0,6,0,0">
                                    <controls:Card Padding="8">
                                        <Grid
                                            Grid.Row="4"
                                            HorizontalAlignment="Center"
                                            ColumnDefinitions="Auto,*,Auto"
                                            RowDefinitions="Auto,*">
                                            <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}"
                                                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"
                                                Command="{Binding GenerateImageCommand}"
                                                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}"
                                                ToolTip.Tip="Generate with current seed" />
                                        </Grid>
                                    </controls:Card>
                                </StackPanel>
                            </Grid>

                        </Tool>
                    </ToolDock>

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

                    <!--  Right Pane  -->
                    <ToolDock
                        x:Name="ImageGalleryPane"
                        Alignment="Right"
                        Id="ImageGalleryPane"
                        Proportion="0.3">
                        <Tool
                            x:Name="ImageGalleryTool"
                            Title="Image Output"
                            x:DataType="Tool"
                            Id="ImageGalleryTool"
                            CanClose="False">
                            <controls:ImageGalleryCard
                                Opacity="1"
                                DataContext="{ReflectionBinding ElementName=Dock, Path=DataContext.ImageGalleryCardViewModel}" />
                        </Tool>
                    </ToolDock>

                </ProportionalDock>
            </RootDock>

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