scroll viewer

src/SUMMARY.md

@@ -71,7 +71,7 @@
   - [Fonts](./fyrox/ui/font.md)
   - [Style](./fyrox/ui/style.md)
   - [Widgets](./fyrox/ui/widgets.md)
-    - [Custom Widget](./fyrox/ui/custom.md) 
+    - [Custom widget](./fyrox/ui/custom.md) 
     - [Button](./fyrox/ui/button.md)
     - [Border](./fyrox/ui/border.md)
     - [Canvas](./fyrox/ui/canvas.md)
@@ -95,10 +95,10 @@
     - [Rect (WIP)](./fyrox/ui/rect.md)        
     - [Scroll bar](./fyrox/ui/scroll_bar.md)        
     - [Scroll panel (WIP)](./fyrox/ui/scroll_panel.md)        
-    - [Scroll viewer (WIP)](./fyrox/ui/scroll_viewer.md)     
+    - [Scroll viewer](./fyrox/ui/scroll_viewer.md)     
     - [Screen](./fyrox/ui/screen.md)
     - [Stack panel](./fyrox/ui/stack_panel.md)        
-    - [Tab Control](./fyrox/ui/tab_control.md)        
+    - [Tab control](./fyrox/ui/tab_control.md)        
     - [Text](./fyrox/ui/text.md)        
     - [Text box](./fyrox/ui/text_box.md)        
     - [Tree (WIP)](./fyrox/ui/tree.md)        

src/fyrox/ui/screen.md

@@ -21,6 +21,7 @@ There are two major ways to create a Screen widget - using the editor or by code
 Go to `Create -> UI` menu and find `Screen` widget there, make sure it is a direct child of the
 root node of the hierarchy. Alternatively, you can right-click on the root node in the hierarchy
 and click `Create Child -> Screen`. After that you can add any number of children nodes to it.
+Screen widget does not have any special properties, so you do not need to tweak it at all.
 
 ### From Code
 

src/fyrox/ui/scroll_viewer.md

@@ -1,3 +1,91 @@
-# Scroll viewer (WIP)
+# Scroll viewer
 
-![scroll viewer](scroll_bar.gif)
+![scroll viewer](scroll_bar.gif)
+
+Scroll viewer is a scrollable region with two scroll bars for each axis. It is used to wrap a content of unknown
+size to ensure that all of it will be accessible in its parent widget bounds. For example, it could be used in a
+[Window](window.md) widget to allow a content of the window to be accessible, even if the window is smaller than 
+the content.
+
+## Example
+
+A scroll viewer widget could be created using `ScrollViewerBuilder`:
+
+```rust
+# extern crate fyrox;
+# use fyrox::gui::{
+#     button::ButtonBuilder, core::pool::Handle, scroll_viewer::ScrollViewerBuilder,
+#     stack_panel::StackPanelBuilder, text::TextBuilder, widget::WidgetBuilder, BuildContext,
+#     UiNode,
+# };
+#
+fn create_scroll_viewer(ctx: &mut BuildContext) -> Handle<UiNode> {
+    ScrollViewerBuilder::new(WidgetBuilder::new())
+        .with_content(
+            StackPanelBuilder::new(
+                WidgetBuilder::new()
+                    .with_child(
+                        ButtonBuilder::new(WidgetBuilder::new())
+                            .with_text("Click Me!")
+                            .build(ctx),
+                    )
+                    .with_child(
+                        TextBuilder::new(WidgetBuilder::new())
+                            .with_text("Some\nlong\ntext")
+                            .build(ctx),
+                    ),
+            )
+            .build(ctx),
+        )
+        .build(ctx)
+}
+```
+
+Keep in mind, that you can change the content of a scroll viewer at runtime using `ScrollViewerMessage::Content` message.
+
+## Scrolling Speed and Controls
+
+Scroll viewer can have an arbitrary scrolling speed for each axis. Scrolling is performed via mouse wheel and by default it
+scrolls vertical axis, which can be changed by holding `Shift` key. Scrolling speed can be set during the build phase:
+
+```rust
+# extern crate fyrox;
+# use fyrox::gui::{
+#     core::pool::Handle, scroll_viewer::ScrollViewerBuilder, widget::WidgetBuilder,
+#     BuildContext, UiNode,
+# };
+#
+fn create_scroll_viewer(ctx: &mut BuildContext) -> Handle<UiNode> {
+    ScrollViewerBuilder::new(WidgetBuilder::new())
+        // Set vertical scrolling speed twice as fast as default scrolling speed.
+        .with_v_scroll_speed(60.0)
+        // Set horizontal scrolling speed slightly lower than the default value (30.0).
+        .with_h_scroll_speed(20.0)
+        .build(ctx)
+}
+```
+
+Also, it could be set using `ScrollViewerMessage::HScrollSpeed` or `ScrollViewerMessage::VScrollSpeed` messages.
+
+## Bringing a child into view
+
+Calculates the scroll values to bring a desired child into view, it can be used for automatic navigation:
+
+```rust
+# extern crate fyrox;
+# use fyrox::gui::{
+#     core::pool::Handle, message::MessageDirection, scroll_viewer::ScrollViewerMessage, UiNode,
+#     UserInterface,
+# };
+fn bring_child_into_view(
+    scroll_viewer: Handle<UiNode>,
+    child: Handle<UiNode>,
+    ui: &UserInterface,
+) {
+    ui.send_message(ScrollViewerMessage::bring_into_view(
+        scroll_viewer,
+        MessageDirection::ToWidget,
+        child,
+    ))
+}
+```