Редактирование:Динамичный интерфейс

Главная InnerCoreРедактирование:Динамичный интерфейс

Внимание! Вы не авторизовались на сайте. Ваш IP-адрес будет публично видимым, если вы будете вносить любые правки. Если вы войдёте или создадите учётную запись, правки вместо этого будут связаны с вашим именем пользователя, а также у вас появятся другие преимущества.

Правка может быть отменена. Пожалуйста, просмотрите сравнение версий, чтобы убедиться, что это именно те изменения, которые вас интересуют, и нажмите «Записать страницу», чтобы изменения вступили в силу.
Текущая версия Ваш текст
Строка 1: Строка 1:
−
<div class="mw-parser-output"><div class="mw-parser-output"><div class="mw-parser-output">
+
 
 
Как упоминалось в уроках ранее, объект описания интерфейса можно изменять, пока интерфейс открыт и изменения тут же будут отображаться в интерфейсе. Больше всего это подходит для элементов, которые должны появляться/изменяться/исчезать только в каких-то определенных условиях (например кнопка, которая появляется, только если в слоте есть предмет)
 
Как упоминалось в уроках ранее, объект описания интерфейса можно изменять, пока интерфейс открыт и изменения тут же будут отображаться в интерфейсе. Больше всего это подходит для элементов, которые должны появляться/изменяться/исчезать только в каких-то определенных условиях (например кнопка, которая появляется, только если в слоте есть предмет)
 +
 +
=== &nbsp; ===
  
 
=== Получение объекта описания ===
 
=== Получение объекта описания ===
  
 
По скольку интерфейс всегда открывается для контейнера, то контейнер имеет метод получения объекта описания интерфейса для динамичного изменения. Этот метод - getGuiContent() - упоминался в прошлой главе и теперь будет разобран подробнее.
 
По скольку интерфейс всегда открывается для контейнера, то контейнер имеет метод получения объекта описания интерфейса для динамичного изменения. Этот метод - getGuiContent() - упоминался в прошлой главе и теперь будет разобран подробнее.
 +
 +
&nbsp;
  
 
Формат объекта описания можно посмотреть в предыущих главах, там же говорится, что динамичными (т.е. изменения которых тут же отобразятся в интерфейсе), являются только части, отвечающие за фон и за элементы - drawing и elements, но не параметры самого интерфейса (заголовок, размер и т.п)
 
Формат объекта описания можно посмотреть в предыущих главах, там же говорится, что динамичными (т.е. изменения которых тут же отобразятся в интерфейсе), являются только части, отвечающие за фон и за элементы - drawing и elements, но не параметры самого интерфейса (заголовок, размер и т.п)
 +
 +
&nbsp;
  
 
И так, предположим мы получили объект описания:
 
И так, предположим мы получили объект описания:
−
<syntaxhighlight lang="Javascript">var content = container.getGuiContent();</syntaxhighlight>
+
<pre>var content = container.getGuiContent();</pre>
 +
 
 +
&nbsp;
  
 
Теперь, чтобы изменить в нем фон, мы можем просто присвоить drawing новое значение:
 
Теперь, чтобы изменить в нем фон, мы можем просто присвоить drawing новое значение:
−
<syntaxhighlight lang="Javascript">content.drawing = [
+
<pre>content.drawing = [
−
     {type: "background", color: android.graphics.Color.RED}
+
 
−
] // мы удалили все прошлые команды и теперь рисуем просто красный фон</syntaxhighlight>
+
    {type: "background", color: android.graphics.Color.RED}
 +
 
 +
] // мы удалили все прошлые команды и теперь рисуем просто красный фон</pre>
 +
 
 +
&nbsp;
  
 
С элементами все несколько иначе, чтобы что-то сделать с элементом, нужно обратиться к нему по его имени: content.elements["имя элемента"], после чего с ним можно сделать 3 разных действия:
 
С элементами все несколько иначе, чтобы что-то сделать с элементом, нужно обратиться к нему по его имени: content.elements["имя элемента"], после чего с ним можно сделать 3 разных действия:
 +
 +
&nbsp;
  
 
1. Приравнять новому элементу - если элемент с данным именем уже существовал, то старый будет полностью заменен на новый, если элемента не было, то будет просто создан новый элемент
 
1. Приравнять новому элементу - если элемент с данным именем уже существовал, то старый будет полностью заменен на новый, если элемента не было, то будет просто создан новый элемент
Строка 23: Строка 37:
  
 
3. Приравнять null - элемент с данным именем будет удален
 
3. Приравнять null - элемент с данным именем будет удален
 +
 +
&nbsp;
  
 
ПРИМЕР #1: (изменение параметров)
 
ПРИМЕР #1: (изменение параметров)
−
<syntaxhighlight lang="Javascript">// код ниже при старте откроет интерфейс с 1 кнопкой, при нажатии на которую она будет перемещаться вниз
+
<pre>// код ниже при старте откроет интерфейс с 1 кнопкой, при нажатии на которую она будет перемещаться вниз
 +
 
 
var testUIScreen = new UI.StandartWindow({
 
var testUIScreen = new UI.StandartWindow({
−
     standart: {
 
−
          header: {
 
−
               text: {
 
−
                    text: "TEST UI"
 
−
               }
 
−
          },
 
  
−
          inventory: {
+
    standart: {
−
               standart: true
 
−
          },
 
  
−
          background: {
+
          header: {
−
               standart: true
 
−
          }
 
−
     },
 
  
−
     drawing: [],
+
              text: {
 +
 
 +
                    text: "TEST UI"
 +
 
 +
              }
 +
 
 +
          },
 +
 
 +
          inventory: {
 +
 
 +
              standart: true
 +
 
 +
          },
 +
 
 +
          background: {
 +
 
 +
              standart: true
 +
 
 +
          }
 +
 
 +
    },
 +
 
 +
    drawing: [],
 +
 
 +
    elements: {
 +
 
 +
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 +
 
 +
                    onClick: function(container){ // функция короткого нажатия, все параметры кроме первого опущены за ненадобностью
 +
 
 +
                        var content = container.getGuiContent(); // получаем объект описания, по скольку кнопку можно нажать только с открытым интерфейсом, то он точно определен
 +
 
 +
                        content.elements["test_button"].y += 10; // немного сдвигаем кнопку вниз, добавляя 10 к координате y
 +
 
 +
                    }
 +
 
 +
              }
 +
 
 +
          }
 +
 
 +
    }
  
−
     elements: {
 
−
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 
−
                    onClick: function(container){ // функция короткого нажатия, все параметры кроме первого опущены за ненадобностью
 
−
                         var content = container.getGuiContent(); // получаем объект описания, по скольку кнопку можно нажать только с открытым интерфейсом, то он точно определен
 
−
                         content.elements["test_button"].y += 10; // немного сдвигаем кнопку вниз, добавляя 10 к координате y
 
−
                    }
 
−
               }
 
−
          }
 
−
     }
 
 
});
 
});
  
 
// открыть интерфейс
 
// открыть интерфейс
−
UI.testUI(testUIScreen);</syntaxhighlight>
+
 
 +
UI.testUI(testUIScreen);</pre>
 +
 
 +
&nbsp;
  
 
ПРИМЕР #2: (удаление и создание)
 
ПРИМЕР #2: (удаление и создание)
−
<syntaxhighlight lang="Javascript">// после нажатия на кнопку, удаляет ее и создает текст о том, что она удалена
+
<pre>// после нажатия на кнопку, удаляет ее и создает текст о том, что она удалена
 +
 
 
var testUIScreen = new UI.StandartWindow({
 
var testUIScreen = new UI.StandartWindow({
−
     standart: {
 
−
          header: {
 
−
               text: {
 
−
                    text: "TEST UI"
 
−
               }
 
−
          },
 
  
−
          inventory: {
+
    standart: {
−
               standart: true
+
 
−
          },
+
          header: {
 +
 
 +
              text: {
 +
 
 +
                    text: "TEST UI"
 +
 
 +
              }
 +
 
 +
          },
 +
 
 +
          inventory: {
 +
 
 +
              standart: true
 +
 
 +
          },
 +
 
 +
          background: {
 +
 
 +
              standart: true
 +
 
 +
          }
 +
 
 +
    },
 +
 
 +
    drawing: [],
 +
 
 +
    elements: {
 +
 
 +
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 +
 
 +
                    onClick: function(container){ // функция короткого нажатия, все параметры кроме первого опущены за ненадобностью
 +
 
 +
                        var content = container.getGuiContent(); // получаем объект описания, по скольку кнопку можно нажать только с открытым интерфейсом, то он точно определен
 +
 
 +
                        content.elements["test_button"] = null; // удаляем кнопку
 +
 
 +
                        content.elements["new_element"] = {type: "text", text: "button removed", x: 400, y: 50, width: 200, height: 50}; // создаем текст о том, что она удалена
  
−
          background: {
+
                    }
−
               standart: true
 
−
          }
 
−
     },
 
  
−
     drawing: [],
+
              }
 +
 
 +
          }
 +
 
 +
    }
  
−
     elements: {
 
−
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 
−
                    onClick: function(container){ // функция короткого нажатия, все параметры кроме первого опущены за ненадобностью
 
−
                         var content = container.getGuiContent(); // получаем объект описания, по скольку кнопку можно нажать только с открытым интерфейсом, то он точно определен
 
−
                         content.elements["test_button"] = null; // удаляем кнопку
 
−
                         content.elements["new_element"] = {type: "text", text: "button removed", x: 400, y: 50, width: 200, height: 50}; // создаем текст о том, что она удалена
 
−
                    }
 
−
               }
 
−
          }
 
−
     }
 
 
});
 
});
  
 
// открыть интерфейс
 
// открыть интерфейс
−
UI.testUI(testUIScreen);</syntaxhighlight>
+
 
 +
UI.testUI(testUIScreen);</pre>
 +
 
 +
&nbsp;
  
 
ПРИМЕР #3: (полная замена + изменение фона)
 
ПРИМЕР #3: (полная замена + изменение фона)
−
<syntaxhighlight lang="Javascript">// после нажатия на кнопку, удаляет ее и создает текст о том, что она удалена, а так же делает фон красным
+
<pre>// после нажатия на кнопку, удаляет ее и создает текст о том, что она удалена, а так же делает фон красным
 +
 
 
var testUIScreen = new UI.StandartWindow({
 
var testUIScreen = new UI.StandartWindow({
−
     standart: {
 
−
          header: {
 
−
               text: {
 
−
                    text: "TEST UI"
 
−
               }
 
−
          },
 
  
−
          inventory: {
+
    standart: {
−
               standart: true
+
 
−
          },
+
          header: {
 +
 
 +
              text: {
 +
 
 +
                    text: "TEST UI"
 +
 
 +
              }
 +
 
 +
          },
 +
 
 +
          inventory: {
  
−
          background: {
+
              standart: true
−
               standart: true
 
−
          }
 
−
     },
 
  
−
     drawing: [],
+
          },
 +
 
 +
          background: {
 +
 
 +
              standart: true
 +
 
 +
          }
 +
 
 +
    },
 +
 
 +
    drawing: [],
 +
 
 +
    elements: {
 +
 
 +
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 +
 
 +
                    onClick: function(container){ // функция короткого нажатия, все параметры кроме первого опущены за ненадобностью
 +
 
 +
                        var content = container.getGuiContent(); // получаем объект описания, по скольку кнопку можно нажать только с открытым интерфейсом, то он точно определен
 +
 
 +
                        content.elements["test_button"] = {type: "text", text: "button removed", x: 400, y: 50, width: 200, height: 50}; // заменяем элемент кнопки на текст о том, что она удалена
 +
 
 +
                        content.drawing = [
 +
 
 +
                              {type: "background", color: android.graphics.Color.RED}
 +
 
 +
                        ]; // мы удалили все прошлые команды и теперь рисуем просто красный фон
 +
 
 +
                    }
 +
 
 +
              }
 +
 
 +
          }
 +
 
 +
    }
  
−
     elements: {
 
−
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 
−
                    onClick: function(container){ // функция короткого нажатия, все параметры кроме первого опущены за ненадобностью
 
−
                         var content = container.getGuiContent(); // получаем объект описания, по скольку кнопку можно нажать только с открытым интерфейсом, то он точно определен
 
−
                         content.elements["test_button"] = {type: "text", text: "button removed", x: 400, y: 50, width: 200, height: 50}; // заменяем элемент кнопки на текст о том, что она удалена
 
−
                         content.drawing = [
 
−
                              {type: "background", color: android.graphics.Color.RED}
 
−
                         ]; // мы удалили все прошлые команды и теперь рисуем просто красный фон
 
−
                    }
 
−
               }
 
−
          }
 
−
     }
 
 
});
 
});
  
 
// открыть интерфейс
 
// открыть интерфейс
−
UI.testUI(testUIScreen);</syntaxhighlight>
+
 
 +
UI.testUI(testUIScreen);</pre>
 +
 
 +
&nbsp;
  
 
ПРИМЕР #4: (tile entity):
 
ПРИМЕР #4: (tile entity):
−
<syntaxhighlight lang="Javascript">// добавляет tile entity интерфейс с кнопкой, которая медленно опускается, пока интерфейс открыт
+
<pre>// добавляет tile entity интерфейс с кнопкой, которая медленно опускается, пока интерфейс открыт
 +
 
 
var testUIScreen = new UI.StandartWindow({
 
var testUIScreen = new UI.StandartWindow({
−
     standart: {
 
−
          header: {
 
−
               text: {
 
−
                    text: "TEST UI"
 
−
               }
 
−
          },
 
  
−
          inventory: {
+
    standart: {
−
               standart: true
 
−
          },
 
  
−
          background: {
+
          header: {
−
               standart: true
 
−
          }
 
−
     },
 
  
−
     drawing: [],
+
              text: {
  
−
     elements: {
+
                    text: "TEST UI"
 +
 
 +
              }
 +
 
 +
          },
 +
 
 +
          inventory: {
 +
 
 +
              standart: true
 +
 
 +
          },
 +
 
 +
          background: {
 +
 
 +
              standart: true
 +
 
 +
          }
 +
 
 +
    },
 +
 
 +
    drawing: [],
 +
 
 +
    elements: {
 +
 
 +
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 +
 
 +
                    onClick: function(container){/* ничего не делаем при клике */}
 +
 
 +
              }
 +
 
 +
          }
 +
 
 +
    }
  
−
          "test_button": {type: "button", bitmap: "close_button_up", x: 400, y: 100, scale: 8, clicker: { // самая обычная кнопка с именем test_button
 
−
                    onClick: function(container){/* ничего не делаем при клике */}
 
−
               }
 
−
          }
 
−
     }
 
 
});
 
});
  
−
// Прототип tile entity:
+
 
 +
Прототип tile entity:
 +
 
 
{
 
{
−
     // ...
 
−
     getGuiScreen: function(){ // функция получения интерфейса - отдаем наш интерфейс
 
−
          return testUIScreen;
 
−
     },
 
  
−
     tick: function(){
+
    // ...
−
          var content = this.container.getGuiContent(); // пытаемся получить объект описания
+
 
−
          if (content){ // если получить удалось
+
    getGuiScreen: function(){ // функция получения интерфейса - отдаем наш интерфейс
−
               content.elements["test_button"].y += .3; // медленно сдвигаем кнопку вниз
+
 
−
          }
+
          return testUIScreen;
−
     }
+
 
−
     // ...
+
    },
−
}
+
 
−
</syntaxhighlight>
+
   
−
</div> </div> </div>
+
 
 +
    tick: function(){
 +
 
 +
          var content = this.container.getGuiContent(); // пытаемся получить объект описания
 +
 
 +
          if (content){ // если получить удалось
 +
 
 +
              content.elements["test_button"].y += .3; // медленно сдвигаем кнопку вниз
 +
 
 +
          }
 +
 
 +
    }
 +
 
 +
    // ...
 +
 
 +
}</pre>

Обратите внимание, что все добавления и изменения текста статьи рассматриваются как выпущенные на условиях лицензии GNU Free Documentation License 1.3 или более поздняя (см. Mineprogramming wiki:Авторские права). Если вы не хотите, чтобы ваши тексты свободно распространялись и редактировались любым желающим, не помещайте их сюда.
Вы также подтверждаете, что являетесь автором вносимых дополнений или скопировали их из источника, допускающего свободное распространение и изменение своего содержимого.
НЕ РАЗМЕЩАЙТЕ БЕЗ РАЗРЕШЕНИЯ МАТЕРИАЛЫ, ОХРАНЯЕМЫЕ АВТОРСКИМ ПРАВОМ!

Отменить | Справка по редактированию (в новом окне)
Источник — «https://wiki.mineprogramming.org/index.php/InnerCore/Динамичный_интерфейс»
Навигация
Инструменты