Хочу представить вам свой проект – библиотеку RUI (Remote User Interface). Библиотека предназначена для создания web-приложений на языке go. 

Особенностью библиотеки заключается в том, что вся обработка данных осуществляется на сервере, а браузер используется как тонкий клиент. Для связи клиента и сервера используется WebSocket. Для разработки вам не нужны HTML/CSS/JavaScript. Все разрабатывается на языке go.

Другие особенности библиотеки: поддержка светлой и темной тем, поддержка стилей оформления, мультиязыковая поддержка, поддержка экранов с разной плотностью пикселей

Библиотека бесплатна и распространяется под MIT лицензией. В данный момент библиотека находится в статусе беты

Если вас это заинтересовало, то начнем

И начнем конечно с приложения “Hello world”

package main

import "github.com/anoshenko/rui"

type helloWorldSession struct {
}

func (content *helloWorldSession) CreateRootView(session rui.Session) rui.View {
	return rui.NewTextView(session, rui.Params {
		rui.Text : "Hello world!!!",
	})
}

func createHelloWorldSession(session rui.Session) rui.SessionContent {
	return new(helloWorldSession)
}

func main() {
	app := rui.NewApplication("Hello world", "icon.svg", createHelloWorldSession)
	app.Start("localhost:8000")
}

В функции main создается rui приложение и запускается основной цикл. При создании приложения задаются 3 параметра: имя приложения, имя иконки и функция createHelloWorldSession. Функция createHelloWorldSession создает структуру, реализующую интерфейс SessionContent:

type SessionContent interface {
	CreateRootView(session rui.Session) rui.View
}

 Для каждой новой сессии создается свой экземпляр структуры.

Функция CreateRootView интерфейса SessionContent создает корневой элемент. Когда пользователь обращается к приложению набрав в браузере адрес "localhost:8000", то создается новая сессия, для нее создается новый экземпляр структуры helloWorldSession и в конце вызывается функция CreateRootView. Функция createRootView возвращает представление строки текста, создаваемое с помощью функции NewTextView.

Если вы хотите, чтобы приложение было видно вне вашего компьютера, то поменяйте адрес в функции Start:

              app.Start(rui.GetLocalIP() + ":80")

 Давайте немного украсим нашу надпись: расположим ее по центру, добавим рамку, тень. Для этого изменим функцию CreateRootView

func (content *helloWorldSession) CreateRootView(session rui.Session) rui.View {
	return rui.NewGridLayout(session, rui.Params{
		rui.Width:               rui.Percent(100),
		rui.Height:              rui.Percent(100),
		rui.CellVerticalAlign:   rui.CenterAlign,
		rui.CellHorizontalAlign: rui.CenterAlign,
		rui.Content: []rui.View{
			rui.NewTextView(session, rui.Params{
				rui.Text:            "Hello world!!!",
				rui.FontName:        "Arial",
				rui.TextSize:        rui.Pt(24),
				rui.TextColor:       rui.White,
				rui.BackgroundColor: rui.Blue,
				rui.Padding:         rui.Px(40),
				rui.Border: rui.NewBorder(rui.Params{
					rui.Style:         rui.SolidLine,
					rui.Width:         rui.Px(2),
					rui.ColorProperty: 0xff808080,
				}),
				rui.Radius: rui.Px(8),
				rui.Shadow: rui.NewViewShadow(rui.Px(2), rui.Px(2), rui.Px(4), rui.Px(2), 0x80808080),
			}),
		},
	})
}

Данный текст, по-моему, довольно ясен. Поэтому сделаю к нему всего пару пояснений.

Функции rui.Percent, rui.Pt  и rui.Px используются для задания размеров, соответственно, в процентах, pt и пикселях

Для того чтобы разместить текст по центру мы помещаем его в контейнер GridLayout.

Пространство контейнера GridLayout разбито на ячейки в виде таблицы. Все дочерние элементы располагаются в ячейках таблицы. В наше примере у GridLayout одна ячейка, в которую помещается текст.

Помимо GridLayout в библиотеке имеются следующие контейнеры:

ListLayout – дочерние элементы располагаются в виде списка (вертикального или горизонтального)

StackLayout  – дочерние элементы занимают все пространство контейнера и располагаются один над одним. Виден только один верхний

ColumnLayout - дочерние элементы располагаются в виде вертикального списка в несколько колонок

AbsolutLayout – положение и размеры дочерних элементов задаются вручную

DetailsView – сворачиваемый контейнер

Resizable – контейнер меняющий размер путем перетаскивания сторон его рамки

Для работы с данными библиотека имеет ряд контролов. Помимо уже использованного  TextView есть следующие:

ListView, TableView, DropDownList, Button, Checkbox, EditView, NumberPicker, ColorPicker, DatePicker, TimePicker, ProgressBar, ImageView, AudioPlayer, VideoPlayer

Назначение данных контролов понятно из их названия.

Кроме них есть еще  CanvasView. Это контрол на котором вы можете рисовать используя различные геометрические фигуры и изображения.

На этом пока все. Если вас заинтересовала моя библиотек, то почитать подробнее о ней можно в readme файле git репозитория (в нем библиотека описана довольно подробно).

Git репозиторий библиотеки

По адресу

Располагается demo программа которая показывает возможности библиотеки.

И в конце просьба не пинать меня сильно в коментах. Это просто проект для души, а не коммерческая библиотека.