80 likes | 153 Views
DATA BINDING , czyli powiązanie danych. Data Binding.
E N D
Data Binding • Bindowanie danych (ang. Data Binding) jest mechanizmem bardzo ważnym, gdyż dzięki wiązaniu danych możemy sprzęgnąć (związać) wartość własności obiektu z polem innej klasy. Taka sytuacja jest schematycznie przedstawiona na poniższym rysunku:
Data Binding • Należy wiedzieć, że wiele kontrolek (wiele właściwości) może być podwiązane pod jedno pole klasy. Dzięki temu programista może wytworzyć taką sytuację, jaka jest przedstawiona na rysunku poniżej: • W takiej sytuacji kontrolki mają sprzęgnięte swoje własności – zmiana związanej własności u jednej z nich spowoduje zmianę własności drugiej kontrolki.
Dane w wiązaniu mogą przepływać w następujący sposób: - OneWay (domyślny) – przepływ jednostronny - TwoWay – przepływ obustronny - OneTime – przepływ jednorazowy (przy uruchomieniu aplikacji)
Data Binding • Przepływ jednostronny OneWay oznacza, że wartość własności związanej będzie aktualizowana tylko, gdy zmieni się pole klasy z nią związanej. Ten typ przepływu danych jest schematycznie przedstawiony na rysunku:
Data Binding • Przepływ dwustronny TwoWay, zapewnia że wartość własności związanej zostanie uaktualniona, gdy pole klasy związanej ulegnie zmianie, jak i to, że pole klasy zmieni się, gdy wartość własności zostanie zmieniona, co pokazuje rysunek: • Przepływ OneTime, mówi natomiast, że wartość własności związanej zostanie uaktualniona raz – podczas startu aplikacji.
Data Binding • Bindowanie danych może się odbywać na dwa sposoby: za pomocą klamr {} oraz znacznika <mx:Binding>. Implementacja za pomocą klamr {}: <?xml version="1.0"?> <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"> <mx:TextInput id="myText1" text="Wprowadź tekst"/> <mx:Text id="myText2" text="{myText1.text}"/> <mx:Text id="myText3" text="{myText1.text.toUpperCase()}"/> </mx:Application> Implementacja za pomocą znacznika <mx:Binding>: <?xml version="1.0"?> <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"> <mx:Binding source="myText1.text" destination="myText2.text" /> <mx:TextInput id="myText1" text="Wprowadź tekst"/> <mx:Text id="myText2"/> </mx:Application>
Data Binding • Przepływ obustronny danych: <?xml version="1.0"?> <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"> <mx:TextInput id="myText1" text="{myText2.text}"/> <mx:TextInput id="myText2" text="{myText1.text}"/> </mx:Application>