Что такое hostComponent? - PullRequest
Новая
       35

Что такое hostComponent?

1 голос
/ 29 марта 2012

Я работаю над прогрессбаром во Flex, и, прочитав немного об этом, я вижу, что есть нечто, называемое hostComponent.

Сайт Adobe сообщает: 

"The host component is the component that uses the skin. By specifying the host component, Spark skins can gain a reference to the component instance that uses the skin by using the hostComponent property."

Но я до сих пор не понимаю, как именно это работает.

Есть быстрое и практическое объяснение?

Спасибо!

1 Ответ

8 голосов
/ 29 марта 2012

Когда вы создаете пользовательские компоненты в архитектуре Spark, вы обычно делите их на две части:

  • класс ActionScript, который содержит основные функциональные возможности пользовательского компонента.Этот класс обычно расширяет SkinnableComponent или SkinnableContainer
  • класс обложки MXML, который слабо связан с этим классом ActionScript и содержит только визуальное представление компонента.Этот класс не должен содержать никакой реальной функциональности, и заменить его другим скином должно быть тривиально.

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

Простой пример

Давайте создадим очень простую панель, расширив SkinnableContainer: 

public class MyPanel extends SkinnableContainer {

    [Bindable]
    public var title:String;

}

Как видите, я создал свойство titleкоторый мы хотим использовать для отображения заголовка на панели.Теперь давайте создадим скин, который использует это свойство: 

<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Metadata>
        [HostComponent("path.to.MyPanel")]
    </fx:Metadata>

    <!-- graphics for title bar go here -->
    <s:Label text="{hostComponent.title}" top="5" left="5" />

    <!-- graphics for panel content go here -->
    <s:Group id="contentGroup" top="30" bottom="0" left="0" right="0" />

</s:Skin>

Узел хоста определен в блоке «метаданных», и вы видите, что мы можем использовать его для привязки его свойств к нашему визуальному представлению.«ContentGroup» существует, потому что это требуется SkinnableContainer;это все элементы, которые вы поместите в пользовательскую панель.Вот как это сделать: 

<myComps:MyPanel title="Panel title" skinClass="path.to.skins.MyPanelSkin">
    <s:Label text="Hello Panel" />
    <!--everything in here goes into the 'contentGroup'-->
</myComps:MyPanel>
...