Whether the video automatically starts playing.
Displays a video.
Video allows playback of video from file or stream through its properties
It is similar to Image; they share the properties
ContentAlignment and they work in the same way for both classes.
Video comes with a set of properties that can be used to configure it or control it, in addition to the properties shared with Image:
Volume: range from 0.0 to 1.0, default is 1.0
Duration: the duration of the video in seconds
Position: the current position of the video in seconds
IsLooping: a bool specifying if the video should loop or not, default is false
Useful triggers that can be used with
<Video> <WhilePlaying /> <!-- Active while the video is playing --> <WhilePaused /> <!-- Active while the video is paused --> <WhileCompleted /> <!-- Active while the video is done playing --> <WhileLoading /> <!-- Active while the video is loading --> <WhileFailed /> <!-- Active if the video failed to load or an error occured --> </Video>
Useful actions that can be used to control
Fuse comes with a set of actions that can be used to control video playback. They all have a common
Target property that specifies which
Video element they control.
<Pause /> <!-- Pauses playback, leaving the current position as-is --> <Stop /> <!-- Stops playback and returns to the beginning of the video --> <Resume /> <!-- Resumes playback from the current position -->
Video is implemented by using the videodecoder provided by the export target and therefore supports whatever the platform supports. Be aware that Windows, OS X, Android and iOS might not share support for some formats
- Android supported formats
- iOS and OS X supported formats (found under 'public.movie')
- Windows supported formats
Playing from the local file system
Videos can also be played from the local file system of the device the app is running on. This can be done by prepending
file:// to the absolute path of the video:
<Video File="file:///data/data/com.fuse.app/video.mp4" />
Notice the three slashes at the start. This is due to unix file system paths always beginning with a
<DockPanel> <Video ux:Name="video" Dock="Fill" File="fuse_video.mp4" IsLooping="true" StretchMode="UniformToFill"> <ProgressAnimation> <Change progressBar.Width="100" /> </ProgressAnimation> </Video> <Rectangle ux:Name="progressBar" Dock="Bottom" Fill="#f00" Width="0%" Height="10" /> <Grid Dock="Bottom" ColumnCount="2" RowCount="1"> <Button Text="Play"> <Clicked> <Resume Target="video" /> </Clicked> </Button> <Button Text="Pause"> <Clicked> <Pause Target="video" /> </Clicked> </Button> </Grid> </DockPanel>
- Fuse.Controls.Video 2.2.1
Interface of Video
File : FileSource ux
Gets the duration of the Video in seconds. getDuration will return 0 until the video has initialized.
Whether the video is playing in a loop.
Pauses playback, leaving the current position as-is.
- The position of the video in seconds
Resumes playback from the current position.
Scale9Margin : float4 ux
StretchMode="Scale9" this defines the four margins that split the video into 9-sections for scaling.
Source : VideoSource ux
Stops playback and returns to the beginning of the video.
Specifies whether a video can become larger or smaller to fill the available space.
StretchMode : StretchMode ux
Specifies how the size of the video element is calculated and how the video is stretched inside it.
Creates a new Video
Inherited from Panel
Inherited from LayoutControl
Inherited from Control
Appearance : object uno
Background : Brush ux
CreateNativeView : IView uno
GraphicsVisual : Visual uno
NativeView : IView uno
Inherited from Element
ActualAnchor : float2 uno
ActualPosition : float2 uno
ActualSize : float2 uno
The Alignment of the
Determines how the aspect ratio is maintained in a situation when it violates the min or max sizing constraints.
BoxSizing : BoxSizingMode ux
The manner in which the size and position of the element is calculated.
CachingMode : CachingMode ux
CalcRenderBounds : VisualBounds uno
ClipToBounds : bool ux
Clips the child elements to the bounds of this element visually.
HitTestMode : HitTestMode ux
Specifies how hit tests should be performed on this element.
IsPointInside(float2) : bool uno
LimitHeight : Size ux
The height limit for an element using
LimitWidth : Size ux
The width limit for an element using
TreeRenderer : ITreeRenderer uno
Visibility : Visibility ux
The Visibility of the
Inherited from Visual
AbsoluteViewportOrigin : float2 uno
AbsoluteZoom : float uno
Begins removing a given node, playing all RemovedAnimations before actual removal.
Begins removing a given visual, playing all RemovedAnimations before actual removal.
Requests that this visual be brought into the visible are of the screen. Typically a containing
ScrollView will scroll to ensure it is visible.
Brings the given child to the front of the Z-order. In UX markup, use the BringToFront trigger action instead.
ChildCount : int uno
The number of child nodes of this visual.
Children : IList of Node ux
The children of the visual. All nodes placed inside the visual in UX markup are assigned to this list. The order of Visuals this list determines the order of layout. The Z-order of the children is by default equal to this order, but can be manipulated separately using methods like BringToFront and SendToBack.
FindTemplate(string) : Template uno
FindViewport : IViewport uno
FirstChild<T> : T uno
GetZOrderChild(int) : Visual uno
HasChildren : bool uno
HasPendingRemove : bool uno
HasVisualChildren : bool uno
Whether this visual has any visual child nodes.
HitTestBounds : VisualBounds uno
IfSnap(float2) : float2 uno
IfSnapDown(float2) : float2 uno
IfSnapUp(float2) : float2 uno
Indicates the visual for this node has changed. This allows the root-level node to know that it must draw, and any caching that it must invalidate the cache for this node.
Indicates the composition of the visual has changed, but that the visual drawing itself is still valid (for example a position change).
IsContextEnabled : bool uno
Whether this node is in an enabled context.
The context is disabled if one of the ancestor nodes have IsEnabled set to
IsInteracting : bool uno
IsLocalVisible : bool uno
Returns whether this visual is visible without concern for whether an ancestor visual is hidden or collapsed.
Returns whether this visual is currently visible. Will return false if any of the ancestor visuals are hidden or collapsed. This property can not be used to check whether a visual is hidden because it is occluded by another visual, or is outside the view but otherwise visible.
LastChild<T> : T uno
The layer this visual belongs to in the Parent container.
LayoutRole : LayoutRole ux
Describes how this visual participates in layout.
LocalBounds : Box uno
LocalToParent(float2) : float2 uno
Converts a coordinate from the local space into the parent space.
LocalTransform : float4x4 uno
OnInvalidateRenderBounds : bool uno
Remove(Node) : bool uno
The list of resources defined at this node.
Sends the given child to the back of the Z-order. In UX markup, use the SendToBack trigger action instead.
Snap(float2) : float2 uno
SnapDown(float2) : float2 uno
SnapToPixels : bool ux
Whether to snap the result of layout of this visual to physical device pixels.
SnapUp(float2) : float2 uno
Converts a coordinate from the parent space into the local space.
ValidFrameCount : int uno
ViewHandle : ViewHandle uno
VisualChildCount : int uno
The number of child visuals of this visual.
VisualContext : VisualContext uno
WindowToLocal(float2) : float2 uno
WorldPosition : float3 uno
WorldTransform : float4x4 uno
Inherited from Node
Bindings : IList of Binding ux
The list of bindings belonging to this node.
ContextParent : Node uno
The context parent is the semantic parent of this node. It is where non-UI structure should be resolved, like looking for the DataContext, a Navigation, or other semantic item.
FindByType<T> : T uno
Finds the first node with a given name that satisfies the given acceptor. The serach algorithm works as follows: Nodes in the subtree are matched first, then it matches the nodes in the subtrees ofthe ancestor nodes by turn all the way to the root. If no matching node is found, the function returns null.
GetNearestAncestorOfType<T> : T uno
IsRootingCompleted : bool uno
Whether rooting for this node is completed. Returns false if unrooting has started.
IsRootingStarted : bool uno
Whether rooting of this node has started. Note that even if this property returns true, rooting may not yet be completed for the node. See also IsRootingCompleted.
Run-time name of the node. This property is automatically set using the ux:Name attribute.
NextSibling<T> : T uno
Returns the next sibling node of the given type.
If you override
OnRooted you must call
base.OnRooted() first in your derived class. No other processing should happen first, otherwise you might end up in an undefined state.
The parent Visual of this node. Will return null if the node is not rooted.
PreviousSibling<T> : T uno
Returns the next sibling node of the given type.
Properties : Properties uno
A linked list holding data for extrinsic properties.
Remove(Binding) : bool uno
SourceFileName : string ux
SourceLineNumber : int ux
SubtreeToString : string uno
Inherited from PropertyObject
Inherited from object
Equals(object) : bool uno
GetHashCode : int uno
Attached UX Attributes
ColorScheme (attached by Resources) : ColorScheme ux
Specifies how an element is docked while inside a DockPanel
Shorthand for setting the
MatchKey property on the implicit
Each created when using the
Items attached property.
Edge (attached by EdgeNavigation) : NavigationEdge ux
LayoutMaster (attached by LayoutControl) : Element ux
Gained (attached by AttachedFocusMembers) : FocusGainedHandler (object, FocusGainedArgs) ux
Called when a Visual receives input focus.
IsFocusable (attached by Focus) : bool ux
Lost (attached by AttachedFocusMembers) : FocusLostHandler (object, FocusLostArgs) ux
Called when a Visual loses input focus.
Clicked (attached by Clicked) : ClickedHandler (object, ClickedArgs) ux
Tapped (attached by Tapped) : TappedHandler (object, TappedArgs) ux
The index of the column the element occupies while in a Grid. If not set, the grid will place the element in a cell according to its position in the child list.
ColumnSpan (attached by Grid) : int ux
The number of columns this element occupies in a Grid. Defaults to 1.
The index of the row the element occupies while in a Grid. If not set, the grid will place the element in a cell according to its position in the child list.
The number of rows this element occupies in a Grid. Defaults to 1.
KeyPressed (attached by AttachedKeyboardMembers) : KeyPressedHandler (object, KeyPressedArgs) ux
Called when a Visual receives a key press event while having input focus. On mobile devices, keyboard input only applies to physical buttons (such as BackButton), not soft keyboards.
KeyReleased (attached by AttachedKeyboardMembers) : KeyReleasedHandler (object, KeyReleasedArgs) ux
Called when a Visual receives a key release event while having input focus. On mobile devices, keyboard input only applies to physical buttons (such as BackButton), not soft keyboards.
FillPadding (attached by Layout) : bool ux
LayoutMasterMode (attached by LayoutMasterAttr) : LayoutMasterMode ux
Determines how the layout of the master element is used to control the size of this one.
Activated (attached by Activated) : PulseHandler (object, EventArgs) ux
Adds a handler for when the page is Activated
Deactivated (attached by Deactivated) : PulseHandler (object, EventArgs) ux
Adds a handler for when the page is Deactivated
Navigation (attached by Navigation) : IBaseNavigation ux
Page (attached by NavigationPageProperty) : Visual ux
Transition (attached by NavigationControl) : NavigationControlTransition ux
Remove (attached by Navigator) : RemoveType ux
SwipeBack (attached by Navigator) : NavigatorSwipeDirection ux
IsPhysicsWorld (attached by World) : bool ux
Entered (attached by AttachedPointerMembers) : PointerEnteredHandler (object, PointerEnteredArgs) ux
Called when a pointer enters a visual.
Left (attached by AttachedPointerMembers) : PointerLeftHandler (object, PointerLeftArgs) ux
Called when a pointer leaves a visual.
Moved (attached by AttachedPointerMembers) : PointerMovedHandler (object, PointerMovedArgs) ux
Called when a pointer is moved on a visual.
Pressed (attached by AttachedPointerMembers) : PointerPressedHandler (object, PointerPressedArgs) ux
Called when a pointer is pressed on the visual.
Released (attached by AttachedPointerMembers) : PointerReleasedHandler (object, PointerReleasedArgs) ux
Called when a pointer is released on a visual.
WheelMoved (attached by AttachedPointerMembers) : PointerWheelMovedHandler (object, PointerWheelMovedArgs) ux
Called when a pointer wheel is moved on a visual.
Interface for objects that can have a script engine representation