• Система автоматизации с открытым исходным кодом на базе esp8266/esp32 микроконтроллеров и приложения IoT Manager. Наша группа в Telegram

Нужна помощь App Inventor

Антон987

Антон987

New member
Здравствуйте! Ребята, может подскажет кто... Нужно сделать приложение, своего рода витрину. На первом экране будут баннеры с информацией и под каждым баннером кнопка. И каждая кнопка должна вести на определенный сайт. После перехода нужна возможность вернуться назад на первый экран, и при переходе на следующий сайт точно так же и так далее. Пробовал сделать на двух экранах: на первом накидал баннеров и кнопок, а на втором под каждый сайт ВебПросмотрщиков (через visible), и только после добавления 10 сайта понял, что приложение жутко тормозит, из за того что на одном экране несколько ВебПросмотрщиков, тоесть, когда пользователь нажимает на какую нибудь кнопку и его перебрасывает на нужный ему сайт, то насам деле у него загружаются сразу 10 сайтов, просто отображается только 1. Сейчас изучаю Переменные и Массивы... вроде как используя их можно сделать все на одном экране, но нифига не получается и в сети ничего не могу найти. Кто шарит хорошо подскажите плиз, а еще лучше накидайте пример из 4-5 сайтов.
 
Юрий Ботов

Юрий Ботов

Moderator
Команда форума
Не проще не городить аппликейшен а сделать именно САЙТ - на html+css+js ? Все будет жить в одном браузере... кода минимум...
 
Антон987

Антон987

New member
Я хочу именно в плей маркете опубликовать... Над сайтом тоже поработаю. Сейчас вот хочу с АппИнвентором разобраться.
Юрий Ботов написал(а):
Не проще не городить аппликейшен а сделать именно САЙТ - на html+css+js ? Все будет жить в одном браузере... кода минимум...
Нажмите для раскрытия...
 
Юрий Ботов

Юрий Ботов

Moderator
Команда форума
Так сделайте сайт и сделайте аппликейшн из единственного ВебПросмотрщика которому пропишите адрес вашего сайта. Этот просмотрщик, это же просто движок Хрома...
 
Антон987

Антон987

New member
Юрий Ботов написал(а):
Так сделайте сайт и сделайте аппликейшн из единственного ВебПросмотрщика которому пропишите адрес вашего сайта. Этот просмотрщик, это же просто движок Хрома...
Нажмите для раскрытия...
А подскажите тогда сайт как лучше сделать? На вордпресс можно?
 
Юрий Ботов

Юрий Ботов

Moderator
Команда форума
на чем угодно. Даже просто в редакторе. Я бы просто в редакторе написал... там немного кода то будет (если делать именно то что вы нарисовали).
 
Антон987

Антон987

New member
Юрий Ботов написал(а):
на чем угодно. Даже просто в редакторе. Я бы просто в редакторе написал... там немного кода то будет (если делать именно то что вы нарисовали).
Нажмите для раскрытия...
Спасибо за совет! Правда редактор для меня не менее дремучий лес, чем аппинвентор))
 
gerkimuyda

gerkimuyda

New member
Ковыряйте:
HTML: 
<html><head>
<title>Index</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>

<center>

<br/><hr/><br/>

<table width=90% border=0>
<tr><td align=center bgcolor="red"><br/>Banner1<br/><br/></td></tr>
<tr><td align=center><input type="button" value="Кнопка1" onClick="location='inline1.html';"></td></tr>
</table>

<br/><hr/><br/>

<table width=90% border=0>
<tr><td align=center bgcolor="green"><br/>Banner2<br/><br/></td></tr>
<tr><td align=center><input type="button" value="Кнопка2" onClick="location='inline2.html';"></td></tr>
</table>

<br/><hr/><br/>

</center>

</html>
HTML: 
<html><head>
<title>Inline1</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>

<div style="border: 1px solid blue; height:20px; position:fixed; display:block; background-color: grey; z-index:1;">
<a href="index.html" onClick="window.history.go(-1);">&lt;&lt;-- Return</a>
</div>

<div id="inline1" style="display:block; position:absolute; top:0px; left:0px; padding-top: 0px; margin-top: 0px; width:100%; height:100%;">
<iframe scrolling="yes" frameborder="0" width=100% height=100% src="https://www.sheldonbrown.com/web_sample1.html" style="display:block;"></iframe>
</div>

</html>
HTML: 
<html><head>
<title>Inline1</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>

<div style="border: 1px solid blue; height:20px; position:fixed; display:block; background-color: grey; z-index:1;">
<a href="index.html" onClick="window.history.go(-1);">&lt;&lt;-- Return</a>
</div>

<div id="inline1" style="display:block; position:absolute; top:0px; left:0px; padding-top: 0px; margin-top: 0px; width:100%; height:100%;">
<iframe scrolling="yes" frameborder="0" width=100% height=100% src="inline-text.html" style="display:block;"></iframe>
</div>

</html>
 

Вложения

Юрий Ботов

Юрий Ботов

Moderator
Команда форума
Вот состряпал простейший шаблон
index.html:
HTML: 
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="utf-8" />
    <title>Template</title>
    <link rel="stylesheet" href="index.css" type="text/css" />
    <script src="index.js"></script>
</head>
<body>
   
    <div id="content0" class="columncell" style="display:none;">
        <h1>Шаблон витрины</h1>
        <div class="cell tab" onclick="switchscreen(1);"></div>
        <div class="cell tab" onclick="switchscreen(2);"></div>           
    </div>
    <div id="content1" class="columncell" style="display:none;">
        <div class="buttons" onclick="switchscreen(0);">Назад</div>
        <h1>Шаблон первого сайта</h1>
        <div class="cell tab">
        </div>
    </div>
    <div id="content2" class="columncell" style="display:none;">
        <div class="buttons" onclick="switchscreen(0);">Назад</div>
        <h1>Шаблон второго сайта</h1>
        <div class="cell tab">
        </div>
    </div>
</body>
</html>
index.css:
CSS: 
html {
    height: 100%;
}

html, body {
    display: flex;
    flex-flow: column;
    overflow: hidden;
}

body {
    flex: 1;
    padding: 0;
    margin: 0;
    background-color: #446;
    color: #ccc;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.row, .rowcell {
    display: flex;
    overflow: hidden;
    flex-flow: row;
}

.column, .columncell {
    display: flex;
    overflow: hidden;
    flex-flow: column;
}

.cell, .rowcell, .columncell {
    flex: 1;
}

.tab {
    margin: 30px;
    background-color: #667;
    color: #fff;
}

.buttons {
    margin: 30px;
    width:200px;
    height:30px;
    background-color: #667;
    color: #fff;
}
    .buttons:hover {
        background-color: #777;
    }
index.js:
JavaScript: 
window.onload = function() {
    document.getElementById('content0').style.display = '';
}

var sitescount = 3;
function switchscreen(num) {
    for(var i = 0; i < sitescount; i++) {
        document.getElementById('content'+i).style.display = (i === num)?"":"none";
    }
}
скиньте их в один каталог и просто откройте index.html браузером
 
Войдите или зарегистрируйтесь для ответа.
Сверху Снизу