viewsplitter-128About ViewSplitter

ViewSplitter is a draggable, customizable divider between two views that can automatically handle resizing or moving the views attached to it.

API Support Forum   Purchase



The ViewSplitter supports both horizontal and vertical orientations and has several options to control its behavior such as:

  • minimumBefore – Sets the minimal amount of space for the view before the splitter
  • minimunAfter – Sets the minimal amount of space for the view after the splitter
  • doubleTapAction – Can be set to move the splitter to the minimum before or after position
  • fullSplitterDraggable – Makes the entire splitter draggable and not just its dragThumb area



ViewSplitter is fully customizable with user definable appearances for every element of its UI and you can control the location of the dragThumb as: Top or Left, Middle, Bottom or Right (depending on the ViewSplitter’s orientation).


iOS Example

using Appracatappra.UIKit.ViewSplitter;

public override void ViewDidLoad ()
	base.ViewDidLoad ();

	// Set the location of the dragThumb
	viewSplitter.thumbLocation = UIViewSplitterThumbLocation.BottomOrRight;

	// Make the entire splitter draggable
	viewSplitter.fullSplitterDraggable = true;

	// Attach views
	viewSplitter.minimumBefore = 0f;
	viewSplitter.viewAfter = rightView;
	viewSplitter.minimumAfter = 150F;

	// Send the splitter to the "before mimimum" if double tapped
	// If double tapped again, return to the previous location
	viewSplitter.doubleTapAction = UIViewSplitterDoubleTapAction.MovesToMimimumBefore;

	// Setup subSplitter
	subSplitter.onMainView = false;
	subSplitter.viewBefore = topView;
	subSplitter.minimumBefore = 200f;
	subSplitter.viewAfter = bottomView;
	subSplitter.minimumAfter = 100f;

	// Move the top view instead of scaling it
	subSplitter.viewBeforeAdjustAction = UIViewSplitterAdjustViewAction.MoveView;

	// Wireup the move button
	moveButton.TouchDown += (sender, e) => {
		// Move the first splitter to the given location

	// Wireup the restyle button
	restyleButton.TouchDown+= (sender, e) => {
		// Restyle to second splitter
		subSplitter.appearance.background=UIColor.FromRGBA(0.038f, 0.581f, 0.836f, 1.000f);
		subSplitter.appearance.backgroundFade=UIColor.FromRGBA(0.587f, 1.000f, 0.568f, 1.000f);
		subSplitter.appearance.thumbBackground=UIColor.FromRGBA(0.587f, 1.000f, 0.568f, 1.000f);
		subSplitter.appearance.thumbBorder=UIColor.FromRGBA(0.038f, 0.581f, 0.836f, 1.000f);