Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.05.2012, 23:34
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

В buttongroup не работают одновременно height и layout: vbox
Почему в компоненте xtype: 'buttongroup' нельзя одновременно использовать опции: {height: 300, layout: "vbox"}?

То есть, когда я задаю эти опции, то размеры buttongroup меняются непредсказуемо, содержимое исчезает или коверкается, а рядом стоящие buttongroup могут пропадать.

Вот пример:

Ext.create('Ext.panel.Panel', {
    title: 'Panel with ButtonGroup',
    width: 300,
    height:600,
    renderTo: document.body,
    bodyPadding: 10,
    html: 'HTML Panel Content',
    tbar: [{
        xtype: 'buttongroup',
        height: 300,
        layout: "vbox",
        title: 'Clipboard',
        items: [{
            text: 'Paste',
            scale: 'large',
            rowspan: 3,
            iconCls: 'add',
            iconAlign: 'top',
            cls: 'btn-as-arrow'
        },{
            xtype:'splitbutton',
            text: 'Menu Button',
            scale: 'large',
            rowspan: 3,
            iconCls: 'add',
            iconAlign: 'top',
            arrowAlign:'bottom',
            menu: [{ text: 'Menu Item 1' }]
        },{
            xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
        },{
            text: 'Copy', iconCls: 'add16'
        },{
            text: 'Format', iconCls: 'add16'
        }]
    }]
});


Исходный рабочий пример находится тут:
http://docs.sencha.com/ext-js/4-1/#!...er.ButtonGroup
Ответить с цитированием
  #2 (permalink)  
Старый 12.05.2012, 23:36
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Из-за этой проблемы не удается выровнять табы в ribbon-компоненте, который я пытаюсь собрать. Пытался внутрь buttongroup ставить panel, то тоже начинаются проблемы с размерами buttongroup (ведут себя непредсказуемо и содержимое пропадает).
Ответить с цитированием
  #3 (permalink)  
Старый 13.05.2012, 08:50
С++/C# modest developer
Отправить личное сообщение для nekto_O Посмотреть профиль Найти все сообщения от nekto_O
 
Регистрация: 07.11.2011
Сообщений: 244

Сообщение от khusamov
Почему в компоненте xtype: 'buttongroup' нельзя одновременно использовать опции: {height: 300, layout: "vbox"}?
То есть, когда я задаю эти опции, то размеры buttongroup меняются непредсказуемо, содержимое исчезает или коверкается, а рядом стоящие buttongroup могут пропадать.
Посмотрел, по-моему работает очень даже предсказуемо, layout: "vbox" задает вертикальное позиционирование, а height: 300 фиксированную высоту. Не заметил чтобы что-то "коверкалось".
В примере columns: 3, указано, у вас вообще не указано, поэтому когда вы убирайте высоту, кнопки скрываются.
Ответить с цитированием
  #4 (permalink)  
Старый 13.05.2012, 16:41
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Цитата:
В примере columns: 3, указано, у вас вообще не указано
Ну так правильно, зачем выставлять колонки если я выставил layout: "vbox"?

Цитата:
по-моему работает очень даже предсказуемо
Сегодня тогда сюда скину полный пример, который у меня работает с ошибками. Может тогда будет видно где я допустил ошибку.
Ответить с цитированием
  #5 (permalink)  
Старый 13.05.2012, 21:05
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Вот, сформировал полностью. Если height: 300 убрать, то без ошибок.

Если высоту оставить, то получается ошибка.
См. скриншот: http://shot.qip.ru/008xDs-2Fspxf9iW/

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<title>Проблемы с ButtonGroup</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link href="http://docs.sencha.com/ext-js/4-1/extjs-build/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
		<script src="http://docs.sencha.com/ext-js/4-1/extjs-build/ext-all-debug.js" type="text/javascript"></script>
		
		<script type="text/javascript">
		
			Ext.Loader.setConfig({ enabled: true });
			
			Ext.onReady(function() {
			
				Ext.create('Ext.panel.Panel', {
				    title: 'Panel with ButtonGroup',
				    width: 300,
				    height:600,
				    renderTo: Ext.getBody(),
				    bodyPadding: 10,
				    html: 'HTML Panel Content',
				    tbar: [{
				        xtype: 'buttongroup',
				        height: 300,
				        layout: "vbox",
				        title: 'Clipboard',
				        items: [{
				            text: 'Paste',
				            scale: 'large',
				            rowspan: 3,
				            iconCls: 'add',
				            iconAlign: 'top',
				            cls: 'btn-as-arrow'
				        },{
				            xtype:'splitbutton',
				            text: 'Menu Button',
				            scale: 'large',
				            rowspan: 3,
				            iconCls: 'add',
				            iconAlign: 'top',
				            arrowAlign:'bottom',
				            menu: [{ text: 'Menu Item 1' }]
				        },{
				            xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
				        },{
				            text: 'Copy', iconCls: 'add16'
				        },{
				            text: 'Format', iconCls: 'add16'
				        }]
				    }]
				});
			
			});

		</script>
		
	</head>
	
	<body></body>

</html>
Ответить с цитированием
  #6 (permalink)  
Старый 13.05.2012, 21:41
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

О, кажется нашел проблему.
Если задавать путь:
http://docs.sencha.com/ext-js/4-1/extjs...
то ошибка есть.

Но если задать путь
http://docs.sencha.com/ext-js/4-0/extjs...
То ошибка пропадает!!!

То есть эта ошибка появилась в Ext версии 4.1
вот незадача, однако...
Ответить с цитированием
  #7 (permalink)  
Старый 14.05.2012, 16:32
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Техподдержка отписала, что это баг и его исправляют:

A bug in Ext JS 4.1. The fix is already in progress...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск