Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
xxadev
vscode
提交
83b1a1c2
V
vscode
项目概览
xxadev
/
vscode
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vscode
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
83b1a1c2
编写于
11月 27, 2019
作者:
J
Joao Moreno
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
splitview: use TLayoutContext
gridview: propagate top, left in layout
上级
fd16e7cc
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
90 addition
and
58 deletion
+90
-58
src/vs/base/browser/ui/centered/centeredViewLayout.ts
src/vs/base/browser/ui/centered/centeredViewLayout.ts
+2
-2
src/vs/base/browser/ui/grid/gridview.ts
src/vs/base/browser/ui/grid/gridview.ts
+45
-15
src/vs/base/browser/ui/splitview/splitview.ts
src/vs/base/browser/ui/splitview/splitview.ts
+33
-33
src/vs/base/test/browser/ui/splitview/splitview.test.ts
src/vs/base/test/browser/ui/splitview/splitview.test.ts
+4
-4
test/splitview/public/index.html
test/splitview/public/index.html
+6
-4
未找到文件。
src/vs/base/browser/ui/centered/centeredViewLayout.ts
浏览文件 @
83b1a1c2
...
...
@@ -42,7 +42,7 @@ function toSplitViewView(view: IView, getHeight: () => number): ISplitViewView {
get
maximumSize
()
{
return
view
.
maximumWidth
;
},
get
minimumSize
()
{
return
view
.
minimumWidth
;
},
onDidChange
:
Event
.
map
(
view
.
onDidChange
,
e
=>
e
&&
e
.
width
),
layout
:
size
=>
view
.
layout
(
size
,
getHeight
()
)
layout
:
(
size
,
offset
)
=>
view
.
layout
(
size
,
getHeight
(),
0
,
offset
)
};
}
...
...
@@ -81,7 +81,7 @@ export class CenteredViewLayout implements IDisposable {
this
.
resizeMargins
();
}
}
else
{
this
.
view
.
layout
(
width
,
height
);
this
.
view
.
layout
(
width
,
height
,
0
,
0
);
}
this
.
didLayout
=
true
;
}
...
...
src/vs/base/browser/ui/grid/gridview.ts
浏览文件 @
83b1a1c2
...
...
@@ -30,7 +30,7 @@ export interface IView {
readonly
onDidChange
:
Event
<
IViewSize
|
undefined
>
;
readonly
priority
?:
LayoutPriority
;
readonly
snap
?:
boolean
;
layout
(
width
:
number
,
height
:
number
):
void
;
layout
(
width
:
number
,
height
:
number
,
top
:
number
,
left
:
number
):
void
;
setVisible
?(
visible
:
boolean
):
void
;
}
...
...
@@ -117,11 +117,16 @@ export interface IGridViewOptions {
readonly
layoutController
?:
ILayoutController
;
}
class
BranchNode
implements
ISplitView
,
IDisposable
{
interface
ILayoutContext
{
readonly
orthogonalSize
:
number
;
readonly
orthogonalOffset
:
number
;
}
class
BranchNode
implements
ISplitView
<
ILayoutContext
>
,
IDisposable
{
readonly
element
:
HTMLElement
;
readonly
children
:
Node
[]
=
[];
private
splitview
:
SplitView
;
private
splitview
:
SplitView
<
ILayoutContext
>
;
private
_size
:
number
;
get
size
():
number
{
return
this
.
_size
;
}
...
...
@@ -129,6 +134,12 @@ class BranchNode implements ISplitView, IDisposable {
private
_orthogonalSize
:
number
;
get
orthogonalSize
():
number
{
return
this
.
_orthogonalSize
;
}
private
_offset
:
number
=
0
;
get
offset
():
number
{
return
this
.
_offset
;
}
private
_orthogonalOffset
:
number
=
0
;
get
orthogonalOffset
():
number
{
return
this
.
_orthogonalOffset
;
}
private
_styles
:
IGridViewStyles
;
get
styles
():
IGridViewStyles
{
return
this
.
_styles
;
}
...
...
@@ -221,7 +232,7 @@ class BranchNode implements ISplitView, IDisposable {
if
(
!
childDescriptors
)
{
// Normal behavior, we have no children yet, just set up the splitview
this
.
splitview
=
new
SplitView
(
this
.
element
,
{
orientation
,
styles
,
proportionalLayout
});
this
.
splitview
.
layout
(
size
,
orthogonalSize
);
this
.
splitview
.
layout
(
size
,
{
orthogonalSize
,
orthogonalOffset
:
0
}
);
}
else
{
// Reconstruction behavior, we want to reconstruct a splitview
const
descriptor
=
{
...
...
@@ -268,20 +279,23 @@ class BranchNode implements ISplitView, IDisposable {
}
}
layout
(
size
:
number
,
o
rthogonalSize
:
number
|
undefined
):
void
{
layout
(
size
:
number
,
o
ffset
:
number
,
ctx
:
ILayoutContext
|
undefined
):
void
{
if
(
!
this
.
layoutController
.
isLayoutEnabled
)
{
return
;
}
if
(
typeof
orthogonalSize
!==
'
number
'
)
{
if
(
typeof
ctx
===
'
undefined
'
)
{
throw
new
Error
(
'
Invalid state
'
);
}
// branch nodes should flip the normal/orthogonal directions
this
.
_size
=
orthogonalSize
;
this
.
_size
=
ctx
.
orthogonalSize
;
this
.
_orthogonalSize
=
size
;
this
.
splitview
.
layout
(
orthogonalSize
,
size
);
this
.
splitview
.
layout
(
ctx
.
orthogonalSize
,
{
orthogonalSize
:
size
,
orthogonalOffset
:
offset
});
}
setVisible
(
visible
:
boolean
):
void
{
...
...
@@ -511,7 +525,7 @@ class BranchNode implements ISplitView, IDisposable {
}
}
class
LeafNode
implements
ISplitView
,
IDisposable
{
class
LeafNode
implements
ISplitView
<
ILayoutContext
>
,
IDisposable
{
private
_size
:
number
=
0
;
get
size
():
number
{
return
this
.
_size
;
}
...
...
@@ -519,6 +533,12 @@ class LeafNode implements ISplitView, IDisposable {
private
_orthogonalSize
:
number
;
get
orthogonalSize
():
number
{
return
this
.
_orthogonalSize
;
}
private
_offset
:
number
=
0
;
get
offset
():
number
{
return
this
.
_offset
;
}
private
_orthogonalOffset
:
number
=
0
;
get
orthogonalOffset
():
number
{
return
this
.
_orthogonalOffset
;
}
readonly
onDidSashReset
:
Event
<
number
[]
>
=
Event
.
None
;
private
_onDidLinkedWidthNodeChange
=
new
Relay
<
number
|
undefined
>
();
...
...
@@ -565,6 +585,14 @@ class LeafNode implements ISplitView, IDisposable {
return
this
.
orientation
===
Orientation
.
HORIZONTAL
?
this
.
size
:
this
.
orthogonalSize
;
}
get
top
():
number
{
return
this
.
orientation
===
Orientation
.
HORIZONTAL
?
this
.
offset
:
this
.
orthogonalOffset
;
}
get
left
():
number
{
return
this
.
orientation
===
Orientation
.
HORIZONTAL
?
this
.
orthogonalOffset
:
this
.
offset
;
}
get
element
():
HTMLElement
{
return
this
.
view
.
element
;
}
...
...
@@ -617,18 +645,20 @@ class LeafNode implements ISplitView, IDisposable {
// noop
}
layout
(
size
:
number
,
o
rthogonalSize
:
number
|
undefined
):
void
{
layout
(
size
:
number
,
o
ffset
:
number
,
ctx
:
ILayoutContext
|
undefined
):
void
{
if
(
!
this
.
layoutController
.
isLayoutEnabled
)
{
return
;
}
if
(
typeof
orthogonalSize
!==
'
number
'
)
{
if
(
typeof
ctx
===
'
undefined
'
)
{
throw
new
Error
(
'
Invalid state
'
);
}
this
.
_size
=
size
;
this
.
_orthogonalSize
=
orthogonalSize
;
this
.
view
.
layout
(
this
.
width
,
this
.
height
);
this
.
_offset
=
offset
;
this
.
_orthogonalSize
=
ctx
.
orthogonalSize
;
this
.
_orthogonalOffset
=
ctx
.
orthogonalOffset
;
this
.
view
.
layout
(
this
.
width
,
this
.
height
,
this
.
top
,
this
.
left
);
}
setVisible
(
visible
:
boolean
):
void
{
...
...
@@ -715,7 +745,7 @@ export class GridView implements IDisposable {
const
{
size
,
orthogonalSize
}
=
this
.
_root
;
this
.
root
=
flipNode
(
this
.
_root
,
orthogonalSize
,
size
);
this
.
root
.
layout
(
size
,
orthogonalSize
);
this
.
root
.
layout
(
size
,
0
,
{
orthogonalSize
,
orthogonalOffset
:
0
}
);
}
get
width
():
number
{
return
this
.
root
.
width
;
}
...
...
@@ -771,7 +801,7 @@ export class GridView implements IDisposable {
this
.
firstLayoutController
.
isLayoutEnabled
=
true
;
const
[
size
,
orthogonalSize
]
=
this
.
root
.
orientation
===
Orientation
.
HORIZONTAL
?
[
height
,
width
]
:
[
width
,
height
];
this
.
root
.
layout
(
size
,
orthogonalSize
);
this
.
root
.
layout
(
size
,
0
,
{
orthogonalSize
,
orthogonalOffset
:
0
}
);
}
addView
(
view
:
IView
,
size
:
number
|
Sizing
,
location
:
number
[]):
void
{
...
...
src/vs/base/browser/ui/splitview/splitview.ts
浏览文件 @
83b1a1c2
...
...
@@ -23,14 +23,14 @@ const defaultStyles: ISplitViewStyles = {
separatorBorder
:
Color
.
transparent
};
export
interface
ISplitViewOptions
{
export
interface
ISplitViewOptions
<
TLayoutContext
=
undefined
>
{
readonly
orientation
?:
Orientation
;
// default Orientation.VERTICAL
readonly
styles
?:
ISplitViewStyles
;
readonly
orthogonalStartSash
?:
Sash
;
readonly
orthogonalEndSash
?:
Sash
;
readonly
inverseAltBehavior
?:
boolean
;
readonly
proportionalLayout
?:
boolean
;
// default true,
readonly
descriptor
?:
ISplitViewDescriptor
;
readonly
descriptor
?:
ISplitViewDescriptor
<
TLayoutContext
>
;
}
/**
...
...
@@ -42,14 +42,14 @@ export const enum LayoutPriority {
High
}
export
interface
IView
{
export
interface
IView
<
TLayoutContext
=
undefined
>
{
readonly
element
:
HTMLElement
;
readonly
minimumSize
:
number
;
readonly
maximumSize
:
number
;
readonly
onDidChange
:
Event
<
number
|
undefined
>
;
readonly
priority
?:
LayoutPriority
;
readonly
snap
?:
boolean
;
layout
(
size
:
number
,
o
rthogonalSize
:
number
|
undefined
):
void
;
layout
(
size
:
number
,
o
ffset
:
number
,
context
:
TLayoutContext
|
undefined
):
void
;
setVisible
?(
visible
:
boolean
):
void
;
}
...
...
@@ -62,7 +62,7 @@ interface ISashEvent {
type
ViewItemSize
=
number
|
{
cachedVisibleSize
:
number
};
abstract
class
ViewItem
{
abstract
class
ViewItem
<
TLayoutContext
>
{
private
_size
:
number
;
set
size
(
size
:
number
)
{
...
...
@@ -115,7 +115,7 @@ abstract class ViewItem {
constructor
(
protected
container
:
HTMLElement
,
private
view
:
IView
,
private
view
:
IView
<
TLayoutContext
>
,
size
:
ViewItemSize
,
private
disposable
:
IDisposable
)
{
...
...
@@ -129,31 +129,31 @@ abstract class ViewItem {
}
}
layout
(
position
:
number
,
orthogonalSize
:
number
|
undefined
):
void
{
this
.
layoutContainer
(
position
);
this
.
view
.
layout
(
this
.
size
,
o
rthogonalSize
);
layout
(
offset
:
number
,
layoutContext
:
TLayoutContext
|
undefined
):
void
{
this
.
layoutContainer
(
offset
);
this
.
view
.
layout
(
this
.
size
,
o
ffset
,
layoutContext
);
}
abstract
layoutContainer
(
position
:
number
):
void
;
abstract
layoutContainer
(
offset
:
number
):
void
;
dispose
():
IView
{
dispose
():
IView
<
TLayoutContext
>
{
this
.
disposable
.
dispose
();
return
this
.
view
;
}
}
class
VerticalViewItem
extends
ViewItem
{
class
VerticalViewItem
<
TLayoutContext
>
extends
ViewItem
<
TLayoutContext
>
{
layoutContainer
(
position
:
number
):
void
{
this
.
container
.
style
.
top
=
`
${
position
}
px`
;
layoutContainer
(
offset
:
number
):
void
{
this
.
container
.
style
.
top
=
`
${
offset
}
px`
;
this
.
container
.
style
.
height
=
`
${
this
.
size
}
px`
;
}
}
class
HorizontalViewItem
extends
ViewItem
{
class
HorizontalViewItem
<
TLayoutContext
>
extends
ViewItem
<
TLayoutContext
>
{
layoutContainer
(
position
:
number
):
void
{
this
.
container
.
style
.
left
=
`
${
position
}
px`
;
layoutContainer
(
offset
:
number
):
void
{
this
.
container
.
style
.
left
=
`
${
offset
}
px`
;
this
.
container
.
style
.
width
=
`
${
this
.
size
}
px`
;
}
}
...
...
@@ -198,26 +198,26 @@ export namespace Sizing {
export
function
Invisible
(
cachedVisibleSize
:
number
):
InvisibleSizing
{
return
{
type
:
'
invisible
'
,
cachedVisibleSize
};
}
}
export
interface
ISplitViewDescriptor
{
export
interface
ISplitViewDescriptor
<
TLayoutContext
>
{
size
:
number
;
views
:
{
visible
?:
boolean
;
size
:
number
;
view
:
IView
;
view
:
IView
<
TLayoutContext
>
;
}[];
}
export
class
SplitView
extends
Disposable
{
export
class
SplitView
<
TLayoutContext
=
undefined
>
extends
Disposable
{
readonly
orientation
:
Orientation
;
readonly
el
:
HTMLElement
;
private
sashContainer
:
HTMLElement
;
private
viewContainer
:
HTMLElement
;
private
size
=
0
;
private
orthogonalSize
:
number
|
undefined
;
private
layoutContext
:
TLayoutContext
|
undefined
;
private
contentSize
=
0
;
private
proportions
:
undefined
|
number
[]
=
undefined
;
private
viewItems
:
ViewItem
[]
=
[];
private
viewItems
:
ViewItem
<
TLayoutContext
>
[]
=
[];
private
sashItems
:
ISashItem
[]
=
[];
private
sashDragState
:
ISashDragState
|
undefined
;
private
state
:
State
=
State
.
Idle
;
...
...
@@ -280,7 +280,7 @@ export class SplitView extends Disposable {
this
.
updateSashEnablement
();
}
constructor
(
container
:
HTMLElement
,
options
:
ISplitViewOptions
=
{})
{
constructor
(
container
:
HTMLElement
,
options
:
ISplitViewOptions
<
TLayoutContext
>
=
{})
{
super
();
this
.
orientation
=
types
.
isUndefined
(
options
.
orientation
)
?
Orientation
.
VERTICAL
:
options
.
orientation
;
...
...
@@ -323,11 +323,11 @@ export class SplitView extends Disposable {
}
}
addView
(
view
:
IView
,
size
:
number
|
Sizing
,
index
=
this
.
viewItems
.
length
):
void
{
addView
(
view
:
IView
<
TLayoutContext
>
,
size
:
number
|
Sizing
,
index
=
this
.
viewItems
.
length
):
void
{
this
.
doAddView
(
view
,
size
,
index
,
false
);
}
removeView
(
index
:
number
,
sizing
?:
Sizing
):
IView
{
removeView
(
index
:
number
,
sizing
?:
Sizing
):
IView
<
TLayoutContext
>
{
if
(
this
.
state
!==
State
.
Idle
)
{
throw
new
Error
(
'
Cant modify splitview
'
);
}
...
...
@@ -419,10 +419,10 @@ export class SplitView extends Disposable {
return
viewItem
.
cachedVisibleSize
;
}
layout
(
size
:
number
,
orthogonalSize
?:
number
):
void
{
layout
(
size
:
number
,
layoutContext
?:
TLayoutContext
):
void
{
const
previousSize
=
Math
.
max
(
this
.
size
,
this
.
contentSize
);
this
.
size
=
size
;
this
.
orthogonalSize
=
orthogonalSize
;
this
.
layoutContext
=
layoutContext
;
if
(
!
this
.
proportions
)
{
const
indexes
=
range
(
this
.
viewItems
.
length
);
...
...
@@ -563,7 +563,7 @@ export class SplitView extends Disposable {
}
}
private
onViewChange
(
item
:
ViewItem
,
size
:
number
|
undefined
):
void
{
private
onViewChange
(
item
:
ViewItem
<
TLayoutContext
>
,
size
:
number
|
undefined
):
void
{
const
index
=
this
.
viewItems
.
indexOf
(
item
);
if
(
index
<
0
||
index
>=
this
.
viewItems
.
length
)
{
...
...
@@ -610,7 +610,7 @@ export class SplitView extends Disposable {
}
distributeViewSizes
():
void
{
const
flexibleViewItems
:
ViewItem
[]
=
[];
const
flexibleViewItems
:
ViewItem
<
TLayoutContext
>
[]
=
[];
let
flexibleSize
=
0
;
for
(
const
item
of
this
.
viewItems
)
{
...
...
@@ -641,7 +641,7 @@ export class SplitView extends Disposable {
return
this
.
viewItems
[
index
].
size
;
}
private
doAddView
(
view
:
IView
,
size
:
number
|
Sizing
,
index
=
this
.
viewItems
.
length
,
skipLayout
?:
boolean
):
void
{
private
doAddView
(
view
:
IView
<
TLayoutContext
>
,
size
:
number
|
Sizing
,
index
=
this
.
viewItems
.
length
,
skipLayout
?:
boolean
):
void
{
if
(
this
.
state
!==
State
.
Idle
)
{
throw
new
Error
(
'
Cant modify splitview
'
);
}
...
...
@@ -875,11 +875,11 @@ export class SplitView extends Disposable {
this
.
contentSize
=
this
.
viewItems
.
reduce
((
r
,
i
)
=>
r
+
i
.
size
,
0
);
// Layout views
let
position
=
0
;
let
offset
=
0
;
for
(
const
viewItem
of
this
.
viewItems
)
{
viewItem
.
layout
(
position
,
this
.
orthogonalSize
);
position
+=
viewItem
.
size
;
viewItem
.
layout
(
offset
,
this
.
layoutContext
);
offset
+=
viewItem
.
size
;
}
// Layout sashes
...
...
src/vs/base/test/browser/ui/splitview/splitview.test.ts
浏览文件 @
83b1a1c2
...
...
@@ -8,7 +8,7 @@ import { Emitter } from 'vs/base/common/event';
import
{
SplitView
,
IView
,
Sizing
,
LayoutPriority
}
from
'
vs/base/browser/ui/splitview/splitview
'
;
import
{
Sash
,
SashState
}
from
'
vs/base/browser/ui/sash/sash
'
;
class
TestView
implements
IView
{
class
TestView
implements
IView
<
number
>
{
private
readonly
_onDidChange
=
new
Emitter
<
number
|
undefined
>
();
readonly
onDidChange
=
this
.
_onDidChange
.
event
;
...
...
@@ -43,7 +43,7 @@ class TestView implements IView {
assert
(
_minimumSize
<=
_maximumSize
,
'
splitview view minimum size must be <= maximum size
'
);
}
layout
(
size
:
number
,
orthogonalSize
:
number
|
undefined
):
void
{
layout
(
size
:
number
,
_offset
:
number
,
orthogonalSize
:
number
|
undefined
):
void
{
this
.
_size
=
size
;
this
.
_orthogonalSize
=
orthogonalSize
;
this
.
_onDidLayout
.
fire
({
size
,
orthogonalSize
});
...
...
@@ -527,11 +527,11 @@ suite('Splitview', () => {
view1
.
dispose
();
});
test
(
'
orthogonal size
propagates to views
'
,
()
=>
{
test
(
'
context
propagates to views
'
,
()
=>
{
const
view1
=
new
TestView
(
20
,
Number
.
POSITIVE_INFINITY
);
const
view2
=
new
TestView
(
20
,
Number
.
POSITIVE_INFINITY
);
const
view3
=
new
TestView
(
20
,
Number
.
POSITIVE_INFINITY
,
LayoutPriority
.
Low
);
const
splitview
=
new
SplitView
(
container
,
{
proportionalLayout
:
false
});
const
splitview
=
new
SplitView
<
number
>
(
container
,
{
proportionalLayout
:
false
});
splitview
.
layout
(
200
);
splitview
.
addView
(
view1
,
Sizing
.
Distribute
);
...
...
test/splitview/public/index.html
浏览文件 @
83b1a1c2
...
...
@@ -18,7 +18,10 @@
color
:
white
;
font-family
:
'Segoe UI'
,
Tahoma
,
Geneva
,
Verdana
,
sans-serif
;
font-weight
:
bold
;
font-size
:
30px
;
font-size
:
20px
;
display
:
flex
;
justify-content
:
center
;
align-items
:
center
;
}
</style>
</head>
...
...
@@ -65,9 +68,8 @@
this
.
setVisible
(
true
);
}
layout
(
width
,
height
,
orientation
)
{
console
.
log
(
`layout@
${
this
.
label
}
`
);
this
.
element
.
style
.
lineHeight
=
`
${
height
}
px`
;
layout
(
width
,
height
,
top
,
left
)
{
this
.
element
.
innerHTML
=
`(
${
top
}
,
${
left
}
)<br />(
${
width
}
,
${
height
}
)`
;
}
setVisible
(
visible
)
{
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录