Code Monkey home page Code Monkey logo

Comments (2)

LuizAntonioPereira avatar LuizAntonioPereira commented on July 19, 2024

How can I edit the model you made so that it looks like this?
image
How can I do like this model?
image

from dock.

wieslawsoltes avatar wieslawsoltes commented on July 19, 2024

You can create any layout you want, for that you can use factory method like this:

Dock/samples/AvaloniaDemo/DemoFactory.cs

Lines 24 to 225 in 12b1294

public override IDock CreateLayout()
{
var document1 = new Document1ViewModel
{
Id = "Document1",
Title = "Document1"
};
var document2 = new Document2ViewModel
{
Id = "Document2",
Title = "Document2"
};
var leftTopTool1 = new LeftTopTool1ViewModel
{
Id = "LeftTop1",
Title = "LeftTop1"
};
var leftTopTool2 = new LeftTopTool2ViewModel
{
Id = "LeftTop2",
Title = "LeftTop2"
};
var leftBottomTool1 = new LeftBottomTool1ViewModel
{
Id = "LeftBottom1",
Title = "LeftBottom1"
};
var leftBottomTool2 = new LeftBottomTool2ViewModel
{
Id = "LeftBottom2",
Title = "LeftBottom2"
};
var rightTopTool1 = new RightTopTool1ViewModel
{
Id = "RightTop1",
Title = "RightTop1"
};
var rightTopTool2 = new RightTopTool2ViewModel
{
Id = "RightTop2",
Title = "RightTop2"
};
var rightBottomTool1 = new RightBottomTool1ViewModel
{
Id = "RightBottom1",
Title = "RightBottom1"
};
var rightBottomTool2 = new RightBottomTool2ViewModel
{
Id = "RightBottom2",
Title = "RightBottom2"
};
var mainLayout = new ProportionalDock
{
Id = "MainLayout",
Title = "MainLayout",
Proportion = double.NaN,
Orientation = Orientation.Horizontal,
ActiveDockable = null,
VisibleDockables = CreateList<IDockable>
(
new ProportionalDock
{
Id = "LeftPane",
Title = "LeftPane",
Proportion = double.NaN,
Orientation = Orientation.Vertical,
ActiveDockable = null,
VisibleDockables = CreateList<IDockable>
(
new ToolDock
{
Id = "LeftPaneTop",
Title = "LeftPaneTop",
Proportion = double.NaN,
ActiveDockable = leftTopTool1,
VisibleDockables = CreateList<IDockable>
(
leftTopTool1,
leftTopTool2
)
},
new SplitterDock()
{
Id = "LeftPaneTopSplitter",
Title = "LeftPaneTopSplitter"
},
new ToolDock
{
Id = "LeftPaneBottom",
Title = "LeftPaneBottom",
Proportion = double.NaN,
ActiveDockable = leftBottomTool1,
VisibleDockables = CreateList<IDockable>
(
leftBottomTool1,
leftBottomTool2
)
}
)
},
new SplitterDock()
{
Id = "LeftSplitter",
Title = "LeftSplitter"
},
new DocumentDock
{
Id = "DocumentsPane",
Title = "DocumentsPane",
IsCollapsable = false,
Proportion = double.NaN,
ActiveDockable = document1,
VisibleDockables = CreateList<IDockable>
(
document1,
document2
)
},
new SplitterDock()
{
Id = "RightSplitter",
Title = "RightSplitter"
},
new ProportionalDock
{
Id = "RightPane",
Title = "RightPane",
Proportion = double.NaN,
Orientation = Orientation.Vertical,
ActiveDockable = null,
VisibleDockables = CreateList<IDockable>
(
new ToolDock
{
Id = "RightPaneTop",
Title = "RightPaneTop",
Proportion = double.NaN,
ActiveDockable = rightTopTool1,
VisibleDockables = CreateList<IDockable>
(
rightTopTool1,
rightTopTool2
)
},
new SplitterDock()
{
Id = "RightPaneTopSplitter",
Title = "RightPaneTopSplitter"
},
new ToolDock
{
Id = "RightPaneBottom",
Title = "RightPaneBottom",
Proportion = double.NaN,
ActiveDockable = rightBottomTool1,
VisibleDockables = CreateList<IDockable>
(
rightBottomTool1,
rightBottomTool2
)
}
)
}
)
};
var dashboardView = new DashboardViewModel
{
Id = "Dashboard",
Title = "Dashboard"
};
var homeView = new HomeViewModel
{
Id = "Home",
Title = "Home",
ActiveDockable = mainLayout,
VisibleDockables = CreateList<IDockable>(mainLayout)
};
var root = CreateRootDock();
root.Id = "Root";
root.Title = "Root";
root.IsCollapsable = false;
root.ActiveDockable = dashboardView;
root.DefaultDockable = dashboardView;
root.VisibleDockables = CreateList<IDockable>(dashboardView, homeView);
return root;
}

or define layout in xaml like this:

Dock/samples/AvaloniaDemo.Perspectives/Layouts/Default.xaml

Line 10 in 12b1294

<dmc:RootDock ActiveDockable="{Binding #Perspective}" DefaultDockable="{Binding #Perspective}" IsCollapsable="False">

from dock.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.