====== API: Layout Controls ======

API-referenca za kontejnere i Layout-Management.

===== TWvdSLayoutControl =====

Automatski formular-layout.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<LayoutControl>
  <LayoutGroup Header="Personal Data">
    <LayoutItem Label="Name:">
      <TextEdit Text="{Binding Name}" />
    </LayoutItem>
    <LayoutItem Label="Email:">
      <TextEdit Text="{Binding Email}" />
    </LayoutItem>
  </LayoutGroup>
  <LayoutGroup Header="Address" IsCollapsible="True">
    <LayoutItem Label="Street:">
      <TextEdit Text="{Binding Street}" />
    </LayoutItem>
    <LayoutItem Label="City:">
      <TextEdit Text="{Binding City}" />
    </LayoutItem>
  </LayoutGroup>
</LayoutControl>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Items | TLayoutItemCollection | nil | Layout-elementi |
^ LabelPosition | TLabelPosition | lpLeft | Left, Top |
^ LabelWidth | Integer | 100 | Širina oznaka |
^ ItemSpacing | Integer | 5 | Razmak između stavki |
^ GroupSpacing | Integer | 10 | Razmak između grupa |

==== TWvdSLayoutGroup ====

| Property | Tip | Opis |
^ Header | string | Naslov grupe |
^ IsCollapsible | Boolean | Može se sklopiti |
^ IsCollapsed | Boolean | Sklopljeno |
^ Items | TLayoutItemCollection | Podelementi |

==== TWvdSLayoutItem ====

| Property | Tip | Opis |
^ Label | string | Oznaka |
^ Control | TWvdSFrameworkElement | Sadržana kontrola |
^ ColSpan | Integer | Raspon stupaca |
^ RowSpan | Integer | Raspon redaka |

----

===== TWvdSDockingManager =====

Docking-sustav za fleksibilan raspored prozora.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<DockingManager>
  <DockPanel Name="Explorer" Position="Left" Width="200">
    <FileExplorer />
  </DockPanel>
  <DockPanel Name="Properties" Position="Right" Width="250">
    <PropertyGrid />
  </DockPanel>
  <DockPanel Name="Output" Position="Bottom" Height="150">
    <OutputLog />
  </DockPanel>
  <DocumentHost>
    <Document Title="MainWindow.pxaml">
      <CodeEditor />
    </Document>
  </DocumentHost>
</DockingManager>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Panels | TDockPanelCollection | nil | Dock-paneli |
^ DocumentHost | TDocumentHost | nil | Područje dokumenata |
^ Theme | TDockingTheme | dtDefault | Tema |
^ AllowFloating | Boolean | True | Plutanje dopušteno |
^ AllowAutoHide | Boolean | True | Auto-Hide dopušteno |

==== Events ====

| Event | Signatura | Opis |
^ OnPanelDocked | TPanelEvent | Panel prikačen |
^ OnPanelFloating | TPanelEvent | Panel pluta |
^ OnPanelClosing | TPanelClosingEvent | Panel se zatvara |

----

===== TWvdSSplitContainer =====

Podijeljeni kontejner.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<SplitContainer Orientation="Horizontal"
                SplitterPosition="0.3">
  <SplitContainer.Panel1>
    <TreeView ItemsSource="{Binding Folders}" />
  </SplitContainer.Panel1>
  <SplitContainer.Panel2>
    <ListView ItemsSource="{Binding Files}" />
  </SplitContainer.Panel2>
</SplitContainer>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Orientation | TWvdSOrientation | oHorizontal | Smjer podjele |
^ SplitterPosition | Double | 0.5 | Pozicija (0-1) |
^ SplitterWidth | Integer | 5 | Širina razdjeljača |
^ Panel1 | TWvdSFrameworkElement | nil | Lijevi/gornji panel |
^ Panel2 | TWvdSFrameworkElement | nil | Desni/donji panel |
^ Panel1MinSize | Integer | 50 | Minimum Panel1 |
^ Panel2MinSize | Integer | 50 | Minimum Panel2 |
^ IsSplitterFixed | Boolean | False | Razdjeljač fiksiran |

----

===== TWvdSGroupControl =====

Grupni kontejner s okvirom.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<GroupControl Header="Options">
  <StackPanel>
    <CheckBox Content="Option 1" />
    <CheckBox Content="Option 2" />
  </StackPanel>
</GroupControl>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Header | string | '' | Naslov |
^ Content | TWvdSFrameworkElement | nil | Sadržaj |
^ BorderStyle | TBorderStyle | bsSingle | None, Single, Double |

----

===== TWvdSXtraScrollBox =====

Scroll-kontejner.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<XtraScrollBox HorizontalScrollBarVisibility="Auto"
               VerticalScrollBarVisibility="Always">
  <StackPanel>
    <!-- Mnogo kontrola -->
  </StackPanel>
</XtraScrollBox>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Content | TWvdSFrameworkElement | nil | Sadržaj |
^ HorizontalScrollBarVisibility | TScrollBarVisibility | svAuto | Hidden, Auto, Visible |
^ VerticalScrollBarVisibility | TScrollBarVisibility | svAuto | Hidden, Auto, Visible |
^ HorizontalOffset | Double | 0 | H-Scroll-pozicija |
^ VerticalOffset | Double | 0 | V-Scroll-pozicija |

----

===== TWvdSFlowLayoutPanel =====

Tečući layout.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<FlowLayoutPanel FlowDirection="LeftToRight"
                 WrapContents="True"
                 ItemSpacing="10">
  <Button Caption="Button 1" />
  <Button Caption="Button 2" />
  <Button Caption="Button 3" />
</FlowLayoutPanel>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ FlowDirection | TFlowDirection | fdLeftToRight | LeftToRight, TopDown, RightToLeft, BottomUp |
^ WrapContents | Boolean | True | Prelamanje |
^ ItemSpacing | Integer | 5 | Razmak |

----

===== TWvdSTableLayoutPanel =====

Tablični layout.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<TableLayoutPanel Columns="Auto,*,100"
                  Rows="Auto,*">
  <Label Text="Name:" Row="0" Column="0" />
  <TextEdit Row="0" Column="1" ColumnSpan="2" />
  <Label Text="Notes:" Row="1" Column="0" />
  <MemoEdit Row="1" Column="1" ColumnSpan="2" />
</TableLayoutPanel>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Columns | string | '' | Definicija stupaca |
^ Rows | string | '' | Definicija redaka |
^ CellSpacing | Integer | 0 | Razmak ćelija |

==== Sintaksa stupaca/redaka ====

| Vrijednost | Značenje |
^ ''Auto'' | Automatska veličina |
^ ''*'' | Popuni dostupan prostor |
^ ''100'' | Fiksna veličina (pikseli) |
^ ''2*'' | Dvostruka proporcija |

----

===== TWvdSPopupContainer =====

Popup-kontejner za prilagođene popupe.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<PopupContainer IsOpen="{Binding ShowPopup}"
                PlacementTarget="{Binding ElementName=targetButton}"
                Placement="Bottom">
  <Border Background="White" Padding="10">
    <StackPanel>
      <Label Text="Popup Content" />
      <Button Caption="Close" Command="{Binding ClosePopup}" />
    </StackPanel>
  </Border>
</PopupContainer>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ IsOpen | Boolean | False | Popup vidljiv |
^ Content | TWvdSFrameworkElement | nil | Sadržaj |
^ PlacementTarget | TWvdSFrameworkElement | nil | Ciljni element |
^ Placement | TPopupPlacement | ppBottom | Bottom, Top, Left, Right, Center |
^ HorizontalOffset | Double | 0 | H-pomak |
^ VerticalOffset | Double | 0 | V-pomak |

----

===== TWvdSCardControl =====

Card-bazirani kontejner.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<CardControl>
  <Card Header="Card 1">
    <Content1 />
  </Card>
  <Card Header="Card 2">
    <Content2 />
  </Card>
</CardControl>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Cards | TCardCollection | nil | Kartice |
^ SelectedCard | TCard | nil | Odabrana kartica |
^ CardSpacing | Integer | 10 | Razmak |

----

===== TWvdSCollapsibleGroup =====

Sklopiva grupa.

==== Namespace ====

''WvdS.UI.Controls.Layout''

==== PXAML ====

<code xml>
<CollapsibleGroup Header="Advanced Options"
                  IsExpanded="False">
  <StackPanel>
    <CheckBox Content="Enable feature X" />
    <SpinEdit Value="100" />
  </StackPanel>
</CollapsibleGroup>
</code>

==== Properties ====

| Property | Tip | Default | Opis |
^ Header | string | '' | Naslov |
^ Content | TWvdSFrameworkElement | nil | Sadržaj |
^ IsExpanded | Boolean | True | Prošireno |
^ CollapseAnimation | Boolean | True | Animacija |

==== Events ====

| Event | Signatura | Opis |
^ OnExpanded | TNotifyEvent | Prošireno |
^ OnCollapsed | TNotifyEvent | Sklopljeno |

----

===== Vidi također =====

  * [[.:control-bibliothek|Biblioteka kontrola]]
  * [[.:tui-layout|TUI Layout]]
  * [[.:api-controls-navigation|Navigation Controls API]]