IWMBrowser/iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Improved button group stacking behaviour if ThrowPropsPlugin is not loaded.

Browse Source
This commit is contained in:
Sebastian Kupke
2019-08-01 10:19:34 +02:00
parent 56407539aa
commit e9f1246e0a
69 changed files with 155 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files
doc/out/pixi_buttongroup.js.html
+29 -23
View File
@@ -1490,8 +1490,8 @@ export default class ButtonGroup extends PIXI.Container {
* or a Theme object.
* @param {number} [opts.minWidth=44] - Button: The minimum width of one button.
* @param {number} [opts.minHeight=44] - Button: The minimum height of one button.
* @param {number} [opts.maxWidth] - The maximum width of the button group. If the buttons are wider than the maximum width, the buttons get stacked. Note: The buttons can only be stacked if margin is not zero.
* @param {number} [opts.maxHeight] - The maximum height of the button group. If the buttons are higher than the maximum height, the buttons get stacked. Note: The buttons can only be stacked if margin is not zero.
* @param {number} [opts.maxWidth] - The maximum width of the button group. If the buttons are wider than the maximum width, the buttons get stacked. Note: The buttons can only be stacked if margin is not zero. Note 2: Load the Greensock ThrowPropsPlugin for smoother animations.
* @param {number} [opts.maxHeight] - The maximum height of the button group. If the buttons are higher than the maximum height, the buttons get stacked. Note: The buttons can only be stacked if margin is not zero. Note 2: Load the Greensock ThrowPropsPlugin for smoother animations.
* @param {number} [opts.stackPadding=10] - The padding for stacked buttons.
* @param {PIXI.Application} [opts.app] - The PixiJS Application. Must be set if you want to use the mousewheel to scroll your button group. Only used when the buttons are stacked (with maxWidth or maxHeight).
* @param {number} [opts.padding=Theme.padding] - Button: The inner spacing (distance from icon and/or label) the the border.
@@ -1904,27 +1904,27 @@ export default class ButtonGroup extends PIXI.Container {
this.capture(event)
if (typeof ThrowPropsPlugin != 'undefined') {
const throwProps = { x: { velocity: 'auto' }, y: { velocity: 'auto' } }
const throwProps = { x: { velocity: 'auto' }, y: { velocity: 'auto' } }
if (this.opts.orientation === 'horizontal') {
const distanceToLeft = this.container.x
const distanceToRight = this.opts.maxWidth - this.container.x - this.__initWidth
if (distanceToLeft > 0 && distanceToLeft > distanceToRight) {
throwProps.x.end = 0
} else if (distanceToRight > 0 && distanceToRight > distanceToLeft) {
throwProps.x.end = this.opts.maxWidth - this.__initWidth
}
} else {
const distanceToTop = this.container.y
const distanceToBottom = this.opts.maxHeight - this.container.y - this.container.height
if (distanceToTop > 0 && distanceToTop > distanceToBottom) {
throwProps.y.end = 0
} else if (distanceToBottom > 0 && distanceToBottom > distanceToTop) {
throwProps.y.end = this.opts.maxHeight - this.container.height
}
if (this.opts.orientation === 'horizontal') {
const distanceToLeft = this.container.x
const distanceToRight = this.opts.maxWidth - this.container.x - this.__initWidth
if (distanceToLeft > 0 && distanceToLeft > distanceToRight) {
throwProps.x.end = 0
} else if (distanceToRight > 0 && distanceToRight > distanceToLeft) {
throwProps.x.end = this.opts.maxWidth - this.__initWidth
}
} else {
const distanceToTop = this.container.y
const distanceToBottom = this.opts.maxHeight - this.container.y - this.container.height
if (distanceToTop > 0 && distanceToTop > distanceToBottom) {
throwProps.y.end = 0
} else if (distanceToBottom > 0 && distanceToBottom > distanceToTop) {
throwProps.y.end = this.opts.maxHeight - this.container.height
}
}
if (typeof ThrowPropsPlugin != 'undefined') {
ThrowPropsPlugin.to(
this.container.position,
{
@@ -1936,6 +1936,12 @@ export default class ButtonGroup extends PIXI.Container {
0.8,
0.4
)
} else {
if (this.opts.orientation === 'horizontal' && throwProps.x.end != null) {
TweenMax.to(this.container.position, 0.3, { x: throwProps.x.end, onUpdate: this.stack.bind(this) })
} else if (this.opts.orientation === 'vertical' && throwProps.y.end != null) {
TweenMax.to(this.container.position, 0.3, { y: throwProps.y.end, onUpdate: this.stack.bind(this) })
}
}
}
}
@@ -1989,7 +1995,7 @@ export default class ButtonGroup extends PIXI.Container {
}
/**
*
*
*/
_stackHorizontal() {
const sorted = []
@@ -2037,7 +2043,7 @@ export default class ButtonGroup extends PIXI.Container {
}
/**
*
*
*/
_stackVertical() {
const sorted = []
@@ -2097,7 +2103,7 @@ export default class ButtonGroup extends PIXI.Container {
<footer class="content-size">
<div class="footer">
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.3</a> on Thu Aug 01 2019 09:51:15 GMT+0200 (Mitteleuropäische Sommerzeit)
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.3</a> on Thu Aug 01 2019 10:17:52 GMT+0200 (Mitteleuropäische Sommerzeit)
</div>
</footer>
</div>