zdm/envoy
zdm/envoy
Archived
3
Fork 0
Code Issues 22 Pull Requests Releases 1 Wiki Activity

Reworked list cell framework to be more extensible

Browse Source
This commit is contained in:
Kai S. K. Engelbart 2020-07-18 11:50:49 +02:00
parent 0a4baad5a2
commit 5183d3dfa6
No known key found for this signature in database
GPG Key ID: 0A48559CA32CB48F
8 changed files with 361 additions and 204 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/main/java/envoy/client/ui/controller/ChatScene.java
View File

@ -35,9 +35,7 @@ import envoy.client.event.MessageCreationEvent;
import envoy.client.net.Client; import envoy.client.net.Client;
import envoy.client.net.WriteProxy; import envoy.client.net.WriteProxy;
import envoy.client.ui.*; import envoy.client.ui.*;
import envoy.client.ui.listcell.ChatControl; import envoy.client.ui.listcell.*;
import envoy.client.ui.listcell.ListCellFactory;
import envoy.client.ui.listcell.MessageControl;
import envoy.data.*; import envoy.data.*;
import envoy.data.Attachment.AttachmentType; import envoy.data.Attachment.AttachmentType;
import envoy.event.*; import envoy.event.*;
@ -139,7 +137,7 @@ public final class ChatScene implements Restorable {
@FXML @FXML
private void initialize() { private void initialize() {
// Initialize message and user rendering // Initialize message and user rendering
messageList.setCellFactory(new ListCellFactory<>(MessageControl::new)); messageList.setCellFactory(MessageListCell::new);
chatList.setCellFactory(new ListCellFactory<>(ChatControl::new)); chatList.setCellFactory(new ListCellFactory<>(ChatControl::new));
settingsButton.setGraphic(new ImageView(IconUtil.loadIconThemeSensitive("settings", DEFAULT_ICON_SIZE))); settingsButton.setGraphic(new ImageView(IconUtil.loadIconThemeSensitive("settings", DEFAULT_ICON_SIZE)));

48
client/src/main/java/envoy/client/ui/listcell/AbstractListCell.java Normal file
View File

@ -0,0 +1,48 @@
package envoy.client.ui.listcell;
import javafx.scene.Node;
import javafx.scene.control.ContentDisplay;
import javafx.scene.control.ListCell;
import javafx.scene.control.ListView;
/**
* Provides a convenience frame for list cell creation.
* <p>
* Project: <strong>envoy-client</strong><br>
* File: <strong>AbstractListCell.java</strong><br>
* Created: <strong>18.07.2020</strong><br>
*
* @author Kai S. K. Engelbart
* @param <T> the type of element displayed by the list cell
* @param <U> the type of node as which the list element will be displayed
* @since Envoy Client v0.1-beta
*/
public abstract class AbstractListCell<T, U extends Node> extends ListCell<T> {
protected ListView<? extends T> listView;
/**
* @param listView the list view inside of which the cell will be displayed
* @since Envoy Client v0.1-beta
*/
public AbstractListCell(ListView<? extends T> listView) {
this.listView = listView;
setContentDisplay(ContentDisplay.GRAPHIC_ONLY);
getStyleClass().add("listElement");
}
@Override
protected final void updateItem(T item, boolean empty) {
super.updateItem(item, empty);
setGraphic(empty || item == null ? null : renderItem(item));
}
/**
* Converts a list item to a node. This can have side effects on the list cell.
*
* @param item the item to render
* @return a node representing the item
* @since Envoy Client v0.1-beta
*/
protected abstract U renderItem(T item);
}

36
client/src/main/java/envoy/client/ui/listcell/GenericListCell.java Normal file
View File

@ -0,0 +1,36 @@
package envoy.client.ui.listcell;
import java.util.function.Function;
import javafx.scene.Node;
import javafx.scene.control.ListView;
/**
* A generic list cell rendering an item using a provided render function.
* <p>
* Project: <strong>envoy-client</strong><br>
* File: <strong>GenericListCell.java</strong><br>
* Created: <strong>18.07.2020</strong><br>
*
* @author Kai S. K. Engelbart
* @param <T> the type of element displayed by the list cell
* @param <U> the type of node as which the list element will be displayed
* @since Envoy Client v0.2-beta
*/
public final class GenericListCell<T, U extends Node> extends AbstractListCell<T, U> {
private Function<? super T, U> renderer;
/**
* @param listView the list view inside of which the cell will be displayed
* @param renderer a function converting a list item to a node
* @since Envoy Client v0.1-beta
*/
public GenericListCell(ListView<? extends T> listView, Function<? super T, U> renderer) {
super(listView);
this.renderer = renderer;
}
@Override
protected U renderItem(T item) { return renderer.apply(item); }
}

34
client/src/main/java/envoy/client/ui/listcell/ListCellFactory.java
View File

@ -17,41 +17,19 @@ import javafx.util.Callback;
* *
* @author Kai S. K. Engelbart * @author Kai S. K. Engelbart
* @param <T> the type of object to display * @param <T> the type of object to display
* @param <U> the type of node displayed
* @since Envoy Client v0.1-beta * @since Envoy Client v0.1-beta
*/ */
public final class ListCellFactory<T> implements Callback<ListView<T>, ListCell<T>> { public final class ListCellFactory<T, U extends Node> implements Callback<ListView<T>, ListCell<T>> {
private final class GenericListCell extends ListCell<T> { private final Function<? super T, U> renderer;
private ListView<? extends T> listView;
private GenericListCell(ListView<? extends T> listView) {
this.listView = listView;
getStyleClass().add("listElement");
}
@Override
protected void updateItem(T item, boolean empty) {
super.updateItem(item, empty);
if (empty || item == null) {
setText(null);
setGraphic(null);
} else {
final var control = converter.apply(item);
prefWidthProperty().bind(listView.widthProperty().subtract(40));
setGraphic(control);
}
}
}
private final Function<? super T, ? extends Node> converter;
/** /**
* @param converter a function converting the type to display into a node * @param renderer a function converting the type to display into a node
* @since Envoy Client v0.1-beta * @since Envoy Client v0.1-beta
*/ */
public ListCellFactory(Function<? super T, ? extends Node> converter) { this.converter = converter; } public ListCellFactory(Function<? super T, U> renderer) { this.renderer = renderer; }
@Override @Override
public ListCell<T> call(ListView<T> listView) { return new GenericListCell(listView); } public ListCell<T> call(ListView<T> listView) { return new GenericListCell<>(listView, renderer); }
} }

31
client/src/main/java/envoy/client/ui/listcell/MessageListCell.java Normal file
View File

@ -0,0 +1,31 @@
package envoy.client.ui.listcell;
import javafx.scene.control.ListView;
import envoy.data.Message;
/**
* A list cell containing messages represented as message controls.
* <p>
* Project: <strong>envoy-client</strong><br>
* File: <strong>MessageListCell.java</strong><br>
* Created: <strong>18.07.2020</strong><br>
*
* @author Kai S. K. Engelbart
* @since Envoy Client v0.1-beta
*/
public final class MessageListCell extends AbstractListCell<Message, MessageControl> {
/**
* @param listView the list view inside of which the cell will be displayed
* @since Envoy Client v0.1-beta
*/
public MessageListCell(ListView<? extends Message> listView) { super(listView); }
@Override
protected MessageControl renderItem(Message message) {
final var control = new MessageControl(message);
prefWidthProperty().bind(listView.widthProperty().multiply(0.6));
return control;
}
}

18
client/src/main/resources/css/base.css
View File

@ -9,11 +9,11 @@
} }
#messageEnterContainer { #messageEnterContainer {
-fx-background-radius: 5em; -fx-background-radius: 5.0em;
} }
#roundButton { #roundButton {
-fx-background-radius: 5em; -fx-background-radius: 5.0em;
} }
.text-area { .text-area {
@ -88,7 +88,7 @@
} }
#loginButton { #loginButton {
-fx-background-radius: 1em; -fx-background-radius: 1.0em;
} }
#registerSwitch { #registerSwitch {
@ -99,7 +99,7 @@
#loginInputField { #loginInputField {
-fx-background-color: transparent; -fx-background-color: transparent;
-fx-border: solid; -fx-border: solid;
-fx-border-width: 0 0 1 0; -fx-border-width: 0.0 0.0 1.0 0.0;
} }
@ -129,5 +129,13 @@
} }
#profilePic { #profilePic {
-fx-radius: 1em; -fx-radius: 1.0em;
} }
.listElement {
-fx-background-color: transparent;
}
.listElement {
-fx-background-color: transparent;
}

4
client/src/main/resources/css/dark.css
View File

@ -50,10 +50,6 @@
-fx-background-color: #303030; -fx-background-color: #303030;
} }
.listElement {
-fx-background-color: transparent;
}
#messageEnterContainer { #messageEnterContainer {
-fx-background-color: #363636; -fx-background-color: #363636;
} }

388
client/src/main/resources/fxml/ChatScene.fxml
View File

@ -18,19 +18,33 @@
<?import javafx.scene.layout.VBox?> <?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?> <?import javafx.scene.text.Font?>
<GridPane fx:id="scene" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="400.0" minWidth="500.0" prefHeight="1152.0" prefWidth="2042.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="envoy.client.ui.controller.ChatScene"> <GridPane fx:id="scene" maxHeight="-Infinity"
maxWidth="-Infinity" minHeight="400.0" minWidth="500.0"
prefHeight="1152.0" prefWidth="2042.0"
xmlns="http://javafx.com/javafx/11.0.1"
xmlns:fx="http://javafx.com/fxml/1"
fx:controller="envoy.client.ui.controller.ChatScene">
<columnConstraints> <columnConstraints>
<ColumnConstraints hgrow="NEVER" maxWidth="327.99997965494794" minWidth="-Infinity" prefWidth="317.0" /> <ColumnConstraints hgrow="NEVER"
<ColumnConstraints hgrow="ALWAYS" maxWidth="1.7976931348623157E308" /> maxWidth="327.99997965494794" minWidth="-Infinity" prefWidth="317.0" />
<ColumnConstraints hgrow="ALWAYS"
maxWidth="1.7976931348623157E308" />
</columnConstraints> </columnConstraints>
<rowConstraints> <rowConstraints>
<RowConstraints maxHeight="122.00000508626302" minHeight="-Infinity" prefHeight="96.66666158040364" vgrow="NEVER" /> <RowConstraints maxHeight="122.00000508626302"
<RowConstraints maxHeight="1.7976931348623157E308" minHeight="50.0" prefHeight="949.3333384195963" vgrow="ALWAYS" /> minHeight="-Infinity" prefHeight="96.66666158040364" vgrow="NEVER" />
<RowConstraints maxHeight="59.3333740234375" minHeight="-Infinity" prefHeight="22.666748046875" vgrow="NEVER" /> <RowConstraints maxHeight="1.7976931348623157E308"
<RowConstraints maxHeight="120.0" minHeight="-Infinity" prefHeight="83.333251953125" vgrow="NEVER" /> minHeight="50.0" prefHeight="949.3333384195963" vgrow="ALWAYS" />
<RowConstraints maxHeight="59.3333740234375"
minHeight="-Infinity" prefHeight="22.666748046875" vgrow="NEVER" />
<RowConstraints maxHeight="120.0" minHeight="-Infinity"
prefHeight="83.333251953125" vgrow="NEVER" />
</rowConstraints> </rowConstraints>
<children> <children>
<ListView id="chatList" fx:id="chatList" focusTraversable="false" onMouseClicked="#chatListClicked" prefHeight="211.0" prefWidth="300.0" GridPane.rowIndex="1" GridPane.rowSpan="2147483647"> <ListView id="chatList" fx:id="chatList"
focusTraversable="false" onMouseClicked="#chatListClicked"
prefHeight="211.0" prefWidth="300.0" GridPane.rowIndex="1"
GridPane.rowSpan="2147483647">
<GridPane.margin> <GridPane.margin>
<Insets right="1.0" /> <Insets right="1.0" />
</GridPane.margin> </GridPane.margin>
@ -40,143 +54,184 @@
<contextMenu> <contextMenu>
<ContextMenu anchorLocation="CONTENT_TOP_LEFT"> <ContextMenu anchorLocation="CONTENT_TOP_LEFT">
<items> <items>
<MenuItem fx:id="deleteContactMenuItem" mnemonicParsing="false" onAction="#deleteContact" text="Delete" /> <MenuItem fx:id="deleteContactMenuItem"
mnemonicParsing="false" onAction="#deleteContact" text="Delete" />
</items> </items>
</ContextMenu> </ContextMenu>
</contextMenu> </contextMenu>
</ListView> </ListView>
<HBox id="topBar" alignment="CENTER_LEFT" prefHeight="100.0"> <HBox id="topBar" alignment="CENTER_LEFT" prefHeight="100.0">
<children> <children>
<ImageView id="profilePic" fx:id="clientProfilePic" fitHeight="43.0" fitWidth="43.0" pickOnBounds="true" preserveRatio="true"> <ImageView id="profilePic" fx:id="clientProfilePic"
<HBox.margin> fitHeight="43.0" fitWidth="43.0" pickOnBounds="true"
<Insets left="15.0" top="5.0" /> preserveRatio="true">
</HBox.margin> <HBox.margin>
</ImageView> <Insets left="15.0" top="5.0" />
<Label id="transparentBackground" fx:id="contactLabel" prefHeight="27.0" prefWidth="134.0"> </HBox.margin>
<padding> </ImageView>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> <Label id="transparentBackground" fx:id="contactLabel"
</padding> prefHeight="27.0" prefWidth="134.0">
<font> <padding>
<Font size="18.0" /> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</font> </padding>
<HBox.margin> <font>
<Insets left="10.0" top="5.0" /> <Font size="18.0" />
</HBox.margin> </font>
</Label> <HBox.margin>
<Region id="transparentBackground" prefHeight="77.0" prefWidth="115.0" /> <Insets left="10.0" top="5.0" />
<VBox id="transparentBackground" alignment="CENTER_RIGHT" prefHeight="200.0" prefWidth="100.0" spacing="5.0"> </HBox.margin>
<children> </Label>
<Button fx:id="settingsButton" mnemonicParsing="true" onAction="#settingsButtonClicked" text=""> <Region id="transparentBackground" prefHeight="77.0"
<padding> prefWidth="115.0" />
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> <VBox id="transparentBackground" alignment="CENTER_RIGHT"
</padding> prefHeight="200.0" prefWidth="100.0" spacing="5.0">
<VBox.margin> <children>
<Insets /> <Button fx:id="settingsButton" mnemonicParsing="true"
</VBox.margin> onAction="#settingsButtonClicked" text="">
</Button> <padding>
<Button mnemonicParsing="true" onAction="#addContactButtonClicked" text=" + "> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
<padding> </padding>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> <VBox.margin>
</padding> <Insets />
</Button> </VBox.margin>
</children> </Button>
<HBox.margin> <Button mnemonicParsing="true"
<Insets right="10.0" /> onAction="#addContactButtonClicked" text=" + ">
</HBox.margin> <padding>
<opaqueInsets> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
<Insets /> </padding>
</opaqueInsets> </Button>
</VBox> </children>
</children> <HBox.margin>
<GridPane.margin> <Insets right="10.0" />
<Insets bottom="1.0" right="1.0" /> </HBox.margin>
</GridPane.margin> <opaqueInsets>
</HBox> <Insets />
<ListView id="messageList" fx:id="messageList" focusTraversable="false" GridPane.columnIndex="1" GridPane.columnSpan="2147483647" GridPane.rowIndex="1" GridPane.rowSpan="2"> </opaqueInsets>
</VBox>
</children>
<GridPane.margin>
<Insets bottom="1.0" right="1.0" />
</GridPane.margin>
</HBox>
<ListView id="messageList" fx:id="messageList"
focusTraversable="false" GridPane.columnIndex="1"
GridPane.columnSpan="2147483647" GridPane.rowIndex="1"
GridPane.rowSpan="2">
<GridPane.margin> <GridPane.margin>
<Insets /> <Insets />
</GridPane.margin> </GridPane.margin>
<padding> <padding>
<Insets bottom="5.0" left="300.0" right="300.0" top="5.0" /> <Insets bottom="5.0" top="5.0" />
</padding> </padding>
</ListView> </ListView>
<HBox alignment="CENTER" GridPane.columnIndex="1" GridPane.rowIndex="3"> <HBox alignment="CENTER" GridPane.columnIndex="1"
<children> GridPane.rowIndex="3">
<Label id="messageEnterContainer" alignment="CENTER" minWidth="500.0" prefHeight="100.0" prefWidth="1300.0"> <children>
<graphic> <Label id="messageEnterContainer" alignment="CENTER"
<TextArea id="messageEnter" fx:id="messageTextArea" disable="true" onInputMethodTextChanged="#messageTextUpdated" onKeyPressed="#checkPostConditions" onKeyTyped="#checkKeyCombination" prefHeight="100.0" prefWidth="1250.0" promptText="Enter Message" wrapText="true"> minWidth="500.0" prefHeight="100.0" prefWidth="1300.0">
<opaqueInsets> <graphic>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> <TextArea id="messageEnter" fx:id="messageTextArea"
</opaqueInsets> disable="true" onInputMethodTextChanged="#messageTextUpdated"
<padding> onKeyPressed="#checkPostConditions"
<Insets left="17.0" right="17.0" /> onKeyTyped="#checkKeyCombination" prefHeight="100.0"
</padding> prefWidth="1250.0" promptText="Enter Message" wrapText="true">
</TextArea> <opaqueInsets>
</graphic> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</Label> </opaqueInsets>
<HBox prefHeight="38.0" prefWidth="100.0" spacing="5.0"> <padding>
<children> <Insets left="17.0" right="17.0" />
<Button id="roundButton" fx:id="postButton" defaultButton="true" disable="true" minWidth="40.0" mnemonicParsing="true" onAction="#postMessage" prefHeight="40.0" prefWidth="40.0" text="Post"> </padding>
<tooltip> </TextArea>
<Tooltip anchorLocation="WINDOW_TOP_LEFT" autoHide="true" maxWidth="350.0" text="Click this button to send the message. If it is disabled, you first have to select a contact to send it to. A message may automatically be sent when you press (Ctrl + ) Enter, according to your preferences. Additionally sends a message when pressing &quot;Alt&quot; + &quot;P&quot;." wrapText="true" /> </graphic>
</tooltip> </Label>
<contextMenu> <HBox prefHeight="38.0" prefWidth="100.0" spacing="5.0">
<ContextMenu anchorLocation="CONTENT_TOP_LEFT"> <children>
<items> <Button id="roundButton" fx:id="postButton"
<MenuItem mnemonicParsing="false" onAction="#copyAndPostMessage" text="Copy and Send" /> defaultButton="true" disable="true" minWidth="40.0"
</items> mnemonicParsing="true" onAction="#postMessage" prefHeight="40.0"
</ContextMenu> prefWidth="40.0" text="Post">
</contextMenu> <tooltip>
<padding> <Tooltip anchorLocation="WINDOW_TOP_LEFT"
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> autoHide="true" maxWidth="350.0"
</padding> text="Click this button to send the message. If it is disabled, you first have to select a contact to send it to. A message may automatically be sent when you press (Ctrl + ) Enter, according to your preferences. Additionally sends a message when pressing &quot;Alt&quot; + &quot;P&quot;."
</Button> wrapText="true" />
<Button id="roundButton" fx:id="voiceButton" disable="true" minWidth="40.0" onAction="#voiceButtonClicked" prefHeight="40.0" prefWidth="40.0"> </tooltip>
<padding> <contextMenu>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> <ContextMenu anchorLocation="CONTENT_TOP_LEFT">
</padding> <items>
</Button> <MenuItem mnemonicParsing="false"
<Button id="roundButton" fx:id="attachmentButton" disable="true" minWidth="40.0" mnemonicParsing="false" onAction="#attachmentButtonClicked" prefHeight="40.0" prefWidth="40.0"> onAction="#copyAndPostMessage" text="Copy and Send" />
<padding> </items>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> </ContextMenu>
</padding> </contextMenu>
</Button> <padding>
<Button id="roundButton" fx:id="rotateButton" minWidth="40.0" mnemonicParsing="false" onAction="#doABarrelRoll" prefHeight="40.0" prefWidth="40.0"> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
<padding> </padding>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> </Button>
</padding> <Button id="roundButton" fx:id="voiceButton" disable="true"
</Button> minWidth="40.0" onAction="#voiceButtonClicked" prefHeight="40.0"
</children> prefWidth="40.0">
<HBox.margin> <padding>
<Insets left="5.0" /> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</HBox.margin> </padding>
</HBox> </Button>
</children> <Button id="roundButton" fx:id="attachmentButton"
<GridPane.margin> disable="true" minWidth="40.0" mnemonicParsing="false"
<Insets bottom="40.0" left="300.0" right="300.0" top="15.0" /> onAction="#attachmentButtonClicked" prefHeight="40.0"
</GridPane.margin> prefWidth="40.0">
</HBox> <padding>
<HBox prefHeight="100.0" prefWidth="200.0" GridPane.columnIndex="1" GridPane.rowIndex="2"> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
<children> </padding>
<Label id="remainingCharsLabel" fx:id="remainingChars" ellipsisString="" maxHeight="30.0" maxWidth="180.0" prefHeight="30.0" prefWidth="180.0" text="remaining chars: 0/x" textFill="LIME" textOverrun="LEADING_WORD_ELLIPSIS" visible="false"> </Button>
<padding> <Button id="roundButton" fx:id="rotateButton"
<Insets bottom="5.0" top="5.0" /> minWidth="40.0" mnemonicParsing="false" onAction="#doABarrelRoll"
</padding> prefHeight="40.0" prefWidth="40.0">
<opaqueInsets> <padding>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</opaqueInsets> </padding>
<tooltip> </Button>
<Tooltip text="Shows how many chars you can still enter in this message" wrapText="true" /> </children>
</tooltip> <HBox.margin>
</Label> <Insets left="5.0" />
<Label fx:id="infoLabel" text="Something happened" textFill="#faa007" visible="false" wrapText="true"> </HBox.margin>
<padding> </HBox>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" /> </children>
</padding> <GridPane.margin>
</Label> <Insets bottom="40.0" left="300.0" right="300.0" top="15.0" />
</children> </GridPane.margin>
</HBox> </HBox>
<ImageView fx:id="attachmentView" pickOnBounds="true" preserveRatio="true" visible="false" GridPane.columnIndex="1" GridPane.columnSpan="2147483647" GridPane.halignment="RIGHT" GridPane.rowIndex="2"> <HBox prefHeight="100.0" prefWidth="200.0"
GridPane.columnIndex="1" GridPane.rowIndex="2">
<children>
<Label id="remainingCharsLabel" fx:id="remainingChars"
ellipsisString="" maxHeight="30.0" maxWidth="180.0"
prefHeight="30.0" prefWidth="180.0" text="remaining chars: 0/x"
textFill="LIME" textOverrun="LEADING_WORD_ELLIPSIS" visible="false">
<padding>
<Insets bottom="5.0" top="5.0" />
</padding>
<opaqueInsets>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</opaqueInsets>
<tooltip>
<Tooltip
text="Shows how many chars you can still enter in this message"
wrapText="true" />
</tooltip>
</Label>
<Label fx:id="infoLabel" text="Something happened"
textFill="#faa007" visible="false" wrapText="true">
<padding>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</padding>
</Label>
</children>
</HBox>
<ImageView fx:id="attachmentView" pickOnBounds="true"
preserveRatio="true" visible="false" GridPane.columnIndex="1"
GridPane.columnSpan="2147483647" GridPane.halignment="RIGHT"
GridPane.rowIndex="2">
<viewport> <viewport>
<Rectangle2D height="20.0" width="20.0" /> <Rectangle2D height="20.0" width="20.0" />
</viewport> </viewport>
@ -184,33 +239,40 @@
<Insets bottom="5.0" right="10.0" top="5.0" /> <Insets bottom="5.0" right="10.0" top="5.0" />
</GridPane.margin> </GridPane.margin>
</ImageView> </ImageView>
<HBox id="topBar" alignment="CENTER_LEFT" prefHeight="100.0" prefWidth="200.0" GridPane.columnIndex="1"> <HBox id="topBar" alignment="CENTER_LEFT" prefHeight="100.0"
<children> prefWidth="200.0" GridPane.columnIndex="1">
<ImageView id="profilePic" fx:id="recipientProfilePic" fitHeight="43.0" fitWidth="43.0" pickOnBounds="true" preserveRatio="true"> <children>
<HBox.margin> <ImageView id="profilePic" fx:id="recipientProfilePic"
<Insets left="20.0" top="5.0" /> fitHeight="43.0" fitWidth="43.0" pickOnBounds="true"
</HBox.margin> preserveRatio="true">
</ImageView> <HBox.margin>
<VBox alignment="CENTER_LEFT" prefHeight="97.0" prefWidth="316.0"> <Insets left="20.0" top="5.0" />
<children> </HBox.margin>
<Label fx:id="topBarContactLabel" text=""> </ImageView>
<font> <VBox alignment="CENTER_LEFT" prefHeight="97.0"
<Font size="18.0" /> prefWidth="316.0">
</font> <children>
</Label> <Label fx:id="topBarContactLabel" text="">
<Label fx:id="topBarStatusLabel" text="" /> <font>
</children> <Font size="18.0" />
<HBox.margin> </font>
<Insets left="15.0" /> </Label>
</HBox.margin> <Label fx:id="topBarStatusLabel" text="" />
</VBox> </children>
<Region prefHeight="200.0" prefWidth="200.0" HBox.hgrow="ALWAYS" /> <HBox.margin>
<Button id="roundButton" fx:id="messageSearchButton" contentDisplay="CENTER" mnemonicParsing="false" prefHeight="40.0" prefWidth="40.0" visible="false"> <Insets left="15.0" />
<HBox.margin> </HBox.margin>
<Insets right="20.0" /> </VBox>
</HBox.margin> <Region prefHeight="200.0" prefWidth="200.0"
</Button> HBox.hgrow="ALWAYS" />
</children> <Button id="roundButton" fx:id="messageSearchButton"
</HBox> contentDisplay="CENTER" mnemonicParsing="false" prefHeight="40.0"
prefWidth="40.0" visible="false">
<HBox.margin>
<Insets right="20.0" />
</HBox.margin>
</Button>
</children>
</HBox>
</children> </children>
</GridPane> </GridPane>