Как подключить меню нижнего колонтитула к снизу в титане Appcelerator?
-
09-10-2019 - |
Вопрос
Как я могу закрепить меню нижнего колонтитула к нижней части экрана на Android и iPhone в титане appcelerator? Я хочу отобразить 3 значки на нижней части экрана.
Решение
я использовал Titanium.ui.View. и установить дно: 0, чтобы докнуть его до дна.
Другие советы
Да, мы используем Ti.ui.toolbar для этого. Давайте посмотрим этот пример код:
var space = Titanium.UI.createButton({
systemButton: Titanium.UI.iPhone.SystemButton.FLEXIBLE_SPACE
});
var buttonNextEnd = Titanium.UI.createButton({
title: '>>'
});
var buttonNext1Page = Titanium.UI.createButton({
title: '>'
});
var buttonPrevEnd = Titanium.UI.createButton({
title: '<<'
});
var buttonPrev1Page = Titanium.UI.createButton({
title: '<'
});
var toolbarNav = Titanium.UI.createToolbar({
left : 0,
bottom: 0,
height : 40,
width : 320,
items: [buttonPrevEnd,space, buttonPrev1Page,space, buttonNext1Page, space,buttonNextEnd]
});
win.add(toolbarNav);
Использовать Titanium.ui.toolbar. для этого.
Если вы используете Appcelerator Сплава
Код в представлении XML
<Alloy>
<Window title="My Nice Title">
... ... ...
... ... ...
<View class="footer-menu"></View>
</Window>
</Alloy>
Код в TSS
".footer-menu": {
backgroundColor: 'red',
width: '100%',
height: 40,
bottom: 0
}
Это толкает вид на снизу. Вот скриншот.
Не использует сплав? Это похоже на JS тоже.
// create window
var win = Ti.UI.createWindow({
// if anything
});
// create view
var footer_menu = Ti.UI.createView({
backgroundColor: 'red',
width: '100%',
height: 40,
bottom: 0
});
// add view to window
win.add(footer_menu);
Надеюсь, это полезно. Спасибо!
var footer = Ti.UI.createView({
height:25
});
var footerButton = Ti.UI.createLabel({
title:'Add Row',
color:'#191',
left:125,
width:'auto',
height:'auto'
});
footer.add(footerButton);
работает на Android, но я до сих пор не знаю, почему кнопка не может появиться на iPhone
Помните, что панели инструментов не совместимы для Android или планшета.
Если вы хотите установить кнопки в нижнюю часть экрана, создайте представление, установите его внизу, а затем распределите кнопки относительно относительной позиции, учитывая ширину экрана.
Вот пример:
function FirstWindow() {
var self = Ti.UI.createWindow({
background : "black",
height : "auto",
width : "auto",
layout : "vertical"
});
teste = Ti.UI.createView({
left : 0,
bottom : 0,
opacity : .7,
backgroundColor : "#3d3d3d",
height : 55
});
var button1 = Ti.UI.createButton({
title : "button 1",
left : 0,
width : Titanium.Platform.displayCaps.platformWidth * 0.3
});
var button2 = Ti.UI.createButton({
title : "button 2",
left : Titanium.Platform.displayCaps.platformWidth * 0.33,
width : Titanium.Platform.displayCaps.platformWidth * 0.3
});
var button3 = Ti.UI.createButton({
title : "button 3",
left : Titanium.Platform.displayCaps.platformWidth * 0.66,
width : Titanium.Platform.displayCaps.platformWidth * 0.3
});
view.add(button1);
view.add(button2);
view.add(button3);
self.add(view);
return self;
}
module.exports = FirstWindow;
Делать это ... Вы позиционируете кнопки в виду.
Первая кнопка (Button1) начинается в «слева от 0» и имеет ширину 30% от вида. Вторая кнопка (кнопка2) начинается после первой кнопки плюс пробел, и так далее ...
И высота из них такая же, как вид.