setAutoWidthForBars.html

<HTML>

<HEAD>

<script>var dFrameFilePath = '../../../../../dFrame/'</script>

<script language="Javascript" src="../../../../../dFrame/dFrame/lib/DFrameAPI.js"></script>

<script language="Javascript">

//Style

DFrameAPI.include('dFrame/styles/blue/styleBlue.js')

DFrameAPI.onLoad = function(){

var dFrame = new DFrame([10, 10, 90, 90], 'Test for autoWidth / Height', dFrameStyle)

barStyle.setBackgroundColor('yellow')

barStyle.setItemsVSpacing(5)

barStyle.setBordersHMargin(5)

barStyle.setBordersVMargin(5)

barStyle.setHeight(45)

barStyle.setAutoHeight('BUTTON')

//============================= Fixed Bar. pos = 'TOP' and startFrom('') => HORIZONTAL BAR

barStyle.setAutoWidth('')

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('BUTTON')

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('CONTENT')

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

//============================= Same code. But:

//============================= Fixed Bar. pos = 'TOP' and startFrom('TOP') => VERTICAL BAR

barStyle.setStartFrom('TOP')

barStyle.setAutoWidth('')

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('BUTTON')

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('CONTENT')

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

//============================= Floating Bar. startFrom('LEFT') => HORIZONTAL BAR

barStyle.setStartFrom('LEFT')

barStyle.setAutoWidth('')

barStyle.setAutoHeight('')

barStyle.setPos([5, 5, 45, '45'])

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('CONTENT')

barStyle.setAutoHeight('')

barStyle.setPos([5, 35, 45, '45'])

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('CONTENT')

barStyle.setAutoHeight('CONTENT')

barStyle.setPos([5, 60, 45, '45'])

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button' + i)

//============================= Same code. But:

//============================= Floating Bar. startFrom('RIGHT') => VERTICAL BAR

barStyle.setStartFrom('TOP')

barStyle.setAutoWidth('')

barStyle.setAutoHeight('')

barStyle.setPos([50, 5, 90, '45'])

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('CONTENT')

barStyle.setAutoHeight('')

barStyle.setPos([50, 35, 90, '45'])

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

barStyle.setAutoWidth('CONTENT')

barStyle.setAutoHeight('CONTENT')

barStyle.setPos([50, 60, 90, '45'])

var bar = dFrame.addBar(barStyle)

for (var i = 0 ; i<2 ; i++) bar.addButton('Button ' + i)

dFrame.show()

}

</script>

</HEAD>

</HTML>