Ескертпе
Бұл бетке кіру үшін қатынас шегін айқындау қажет. Жүйеге кіруді немесе каталогтарды өзгертуді байқап көруге болады.
Бұл бетке кіру үшін қатынас шегін айқындау қажет. Каталогтарды өзгертуді байқап көруге болады.
Примечание.
Эта книга была опубликована весной 2016 года и с тех пор не обновлялась. Многое в этой книге остается ценным, но некоторые материалы устарели, а некоторые разделы перестали быть полностью верными или полными.
Как и StackLayout, AbsoluteLayout является производным от Layout<View> и наследует свойство Children. AbsoluteLayout реализует систему макета, в которой программисту нужно указывать позиции дочерних элементов и их размер (необязательно). Эти позиции определяются по координатам левого верхнего угла дочернего элемента относительно левого верхнего угла AbsoluteLayout, выраженным в не зависящих от устройства единицах измерения. AbsoluteLayout также реализует функции пропорционального размещения и изменения размера.
AbsoluteLayout следует рассматривать как специализированную систему макета, которая используется только в том случае, когда программисту важно строго определять размер дочерних элементов (например, элементов BoxView) или когда размер элемента не влияет на расположение других дочерних элементов. Свойства HorizontalOptions и VerticalOptions не влияют на дочерние элементы AbsoluteLayout.
В этой главе также представлена важная концепция присоединенных привязываемых свойств, которые позволяют присоединять свойства, определенные в одном классе (в нашем примере это AbsoluteLayout) к другому классу (дочернему элементу AbsoluteLayout).
Код для AbsoluteLayout
Вы можете добавить дочерний элемент в коллекцию Children элемента AbsoluteLayout с помощью стандартного метода Add, но AbsoluteLayout предоставляет еще и расширенный метод Add, который позволяет указать Rectangle. Еще один метод Add требует только Point, то есть дочерний элемент неограничен и самостоятельно задает свои размеры.
Можно создать Rectangle значение с конструктором, требующим четырех значений — первые два, указывающие положение левого верхнего угла дочернего элемента относительно родительского элемента, а второй — размер дочернего элемента. Также можно использовать конструктор, который принимает Point и значение Size.
Эти методы Add демонстрируются в примере AbsoluteDemo, который позиционирует элементы BoxView с помощью значений Rectangle и элемент Label по одному значению Point.
В примере ChessboardFixed для создания шаблона шахматной доски используются 32 элемента BoxView. Программа присваивает элементам BoxView жестко запрограммированный размер обеих сторон 35 единиц. Для AbsoluteLayout параметрам HorizontalOptions и VerticalOptions присвоено значение LayoutOptions.Center, в результате чего общий размер AbsoluteLayout соответствует квадрату со стороной 280 единиц.
Присоединенные привязываемые свойства
Вы можете также задать позицию и (необязательно) размер дочернего элемента AbsoluteLayout после добавления его в коллекцию Children, используя статический метод AbsoluteLayout.SetLayoutBounds. Первым аргументом он принимает дочерний элемент, а вторым — объект Rectangle. Можно указать, что дочерние размеры сами по горизонтали и (или) по вертикали задают ширину и высоту AbsoluteLayout.AutoSize константы.
Пример ChessboardDynamic размещает AbsoluteLayout в ContentView с обработчиком SizeChanged для вызова AbsoluteLayout.SetLayoutBounds из всех дочерних элементов, чтобы максимально увеличить их размер.
Присоединенное привязываемое свойство, определенное в AbsoluteLayout, является статическим полем только для чтения с типом BindableProperty и именем AbsoluteLayout.LayoutBoundsProperty. Статический метод AbsoluteLayout.SetLayoutBounds реализуется путем вызова SetValue из дочернего элемента с помощью AbsoluteLayout.LayoutBoundsProperty. Этот дочерний элемент содержит словарь, в котором хранятся присоединенное привязываемой свойство и его значение. На этапе создания макета AbsoluteLayout может получить это значение, вызвав AbsoluteLayout.GetLayoutBounds, который реализуется вызовом GetValue.
Пропорциональный размер и размещение
AbsoluteLayout реализует функцию пропорционального размера и размещения. Этот класс определяет второе присоединенное привязываемой свойство LayoutFlagsProperty с соответствующими статическими методами AbsoluteLayout.SetLayoutFlags и AbsoluteLayout.GetLayoutFlags.
Аргумент AbsoluteLayout.SetLayoutFlags и возвращаемое значение AbsoluteLayout.GetLayoutFlags имеют тип AbsoluteLayoutFlags, то есть перечисление со следующими элементами:
None(равно значению 0);XProportional(1);YProportional(2);PositionProportional(3);WidthProportional(4);HeightProportional(8);SizeProportional(12);All(\xFFFFFFFF).
Их можно объединять с помощью оператора "побитового ИЛИ" из C#.
При установке этих флагов некоторые свойства структуры связывания макета Rectangle, которые применяются для выбора положения и размера дочернего элемента, рассматриваются как пропорциональные.
Если задан флаг WidthProportional, значение 1 для параметра Width означает, что ширина дочернего элемента совпадает с шириной AbsoluteLayout. Такой же подход используется для высоты.
При пропорциональном размещении учитывается размер элементов. Если задан флаг XProportional, свойство X структуры макета Rectangle вычисляется как пропорциональное. Значение 0 означает, что левый край дочернего элемента размещается по левому краю AbsoluteLayout, но положение 1 означает, что правый край дочернего элемента размещается по правому краю AbsoluteLayout, а не за правым краем AbsoluteLayout, как можно было бы ожидать. Значение 0,5 для свойства X размещает дочерний элемент в центре AbsoluteLayout по горизонтальной оси.
Пример ChessboardProportional демонстрирует применение функции пропорционального размера и размещения.
Использование пропорциональных координат
Иногда бывает удобно использовать пропорциональное размещение не так, как оно реализовано в AbsoluteLayout. Вы можете предпочесть пропорциональные координаты, при использовании которых значение 1 для свойства X размещает левый (а не правый) край дочернего элемента по правому краю AbsoluteLayout.
Эту альтернативную схему размещения можно назвать "дробными дочерними координатами". Вы можете преобразовать из дробных дочерних координат в границы макета, необходимые для AbsoluteLayout использования следующих формул:
layoutBounds.X = (fractionalChildCoordinate.X / (1 - layoutBounds.Width))
layoutBounds.Y = (fractionalChildCoordinate.Y / (1 - layoutBounds.Height))
Этот подход демонстрируется в примере ProportionalCoordinateCalc.
AbsoluteLayout и XAML
Вы можете применить AbsoluteLayout в XAML и настроить присоединенные привязываемые свойства дочерних элементов AbsoluteLayout с помощью значений атрибутов AbsoluteLayout.LayoutBounds и AbsoluteLayout.LayoutFlags. Этот подход применяется в примерах AbsoluteXamlDemo и ChessboardXaml. Вторая из этих программ содержит 32 элемента BoxView, но с помощью неявного Style со свойством AbsoluteLayout.LayoutFlags обходится минимальным количеством разметки.
В XAML атрибут, состоящий из имени класса, символа точки и имени свойства всегда является присоединенным привязываемым свойством.
Наложения
Вы можете с помощью AbsoluteLayout создать наложение, которое перекрывает страницу другими элементами управления, например для защиты от вмешательства пользователя в работу основных элементов управления на этой страницы.
Пример SimpleOverlay демонстрирует эту методику и ProgressBar, с помощью которой обозначает ход выполнения задачи в программе.
Немного развлечений
Пример DotMatrixClock отображает текущее время на модели матричного дисплея размером 5x7 точек. Каждая точка представляет собой BoxView (в общей сложности их 228), которому присваивается размер и положение на AbsoluteLayout.
Программа BouncingText перемещает по экрану два объекта Label, моделируя отражение от горизонтальных и вертикальных границ экрана.