Visual transition, SVG/AGIF added
[platform/core/csapi/nui.git] / NUISamples / NUISamples / NUISamples.TizenTV / examples / visuals-using-custom-view / ContactView.cs
1 /*
2  * Copyright (c) 2017 Samsung Electronics Co., Ltd.
3  *
4  * Licensed under the Apache License, Version 2.0 (the "License");
5  * you may not use this file except in compliance with the License.
6  * You may obtain a copy of the License at
7  *
8  * http://www.apache.org/licenses/LICENSE-2.0
9  *
10  * Unless required by applicable law or agreed to in writing, software
11  * distributed under the License is distributed on an "AS IS" BASIS,
12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13  * See the License for the specific language governing permissions and
14  * limitations under the License.
15  *
16  */
17
18 using System;
19 using Tizen.NUI;
20 using Tizen.NUI.Constants;
21
22 // A ContactView is a Custom View which consists of four visuals (Image, Primitive, Text and Color).
23 // All of these visuals can be configured via properties - ImageURL (Image), Shape (Primitive), Name (Text) and Color.
24 // Tap gesture is also enabled on the ContactView which changes the color visual to some random color when ContactView is tapped.
25
26 namespace VisualsUsingCustomView
27 {
28     public class ContactView : CustomView
29     {
30         private const int ColorVisualPropertyIndex = 0;
31         private const int PrimitiveVisualPropertyIndex = 1;
32         private const int ImageVisualPropertyIndex = 2;
33         private const int TextVisualPropertyIndex = 3;
34         private VisualBase _imageVisual;
35         private VisualBase _colorVisual;
36         private VisualBase _primitiveVisual;
37         private VisualBase _textVisual;
38         private int _shape;
39         private string _imageURL;
40         private string _name;
41         private Color _color;
42
43         public ContactView() : base(typeof(ContactView).Name, CustomViewBehaviour.RequiresKeyboardNavigationSupport)
44         {
45         }
46
47         public string ImageURL
48         {
49             get
50             {
51                 return _imageURL;
52             }
53             set
54             {
55                 _imageURL = value;
56
57                 // Create and Register Image Visual
58                 PropertyMap imageVisual = new PropertyMap();
59                 imageVisual.Add( Visual.Property.Type, new PropertyValue( (int)Visual.Type.Image ))
60                     .Add( ImageVisualProperty.URL, new PropertyValue( _imageURL ));
61                 _imageVisual =  VisualFactory.Get().CreateVisual( imageVisual );
62                 RegisterVisual( ImageVisualPropertyIndex, _imageVisual );
63
64                 // Set the depth index for Image visual
65                 _imageVisual.DepthIndex = ImageVisualPropertyIndex;
66             }
67         }
68
69         public string Name
70         {
71             get
72             {
73                 return _name;
74             }
75             set
76             {
77                 _name = value;
78
79                 // Create and Register Text Visual
80                 PropertyMap textVisual = new PropertyMap();
81                 textVisual.Add(Visual.Property.Type, new PropertyValue((int)Visual.Type.Text))
82                     .Add(TextVisualProperty.Text, new PropertyValue(_name))
83                     .Add(TextVisualProperty.TextColor, new PropertyValue(Color.White))
84                     .Add(TextVisualProperty.PointSize, new PropertyValue(7))
85                     .Add( TextVisualProperty.HorizontalAlignment, new PropertyValue("CENTER"))
86                     .Add( TextVisualProperty.VerticalAlignment, new PropertyValue("CENTER"));
87                 _textVisual =  VisualFactory.Get().CreateVisual( textVisual );
88                 RegisterVisual( TextVisualPropertyIndex, _textVisual );
89
90                 // Set the depth index for Text visual
91                 _textVisual.DepthIndex = TextVisualPropertyIndex;
92             }
93         }
94
95         public Color Color
96         {
97             get
98             {
99                 return _color;
100             }
101             set
102             {
103                 _color = value;
104
105                 // Create and Register Color Visual
106                 PropertyMap colorVisual = new PropertyMap();
107                 colorVisual.Add( Visual.Property.Type, new PropertyValue( (int)Visual.Type.Color ))
108                     .Add( ColorVisualProperty.MixColor, new PropertyValue( _color ));
109                 _colorVisual =  VisualFactory.Get().CreateVisual( colorVisual );
110                 RegisterVisual( ColorVisualPropertyIndex, _colorVisual );
111
112                 // Set the depth index for Color visual
113                 _colorVisual.DepthIndex = ColorVisualPropertyIndex;
114             }
115         }
116
117         public int Shape
118         {
119             get
120             {
121                 return _shape;
122             }
123             set
124             {
125                 _shape = value;
126
127                 // Create and Register Primitive Visual
128                 PropertyMap primitiveVisual = new PropertyMap();
129                 primitiveVisual.Add( Visual.Property.Type, new PropertyValue( (int)Visual.Type.Primitive ))
130                     .Add( PrimitiveVisualProperty.Shape, new PropertyValue(_shape))
131                     .Add( PrimitiveVisualProperty.BevelPercentage, new PropertyValue(0.3f))
132                     .Add( PrimitiveVisualProperty.BevelSmoothness, new PropertyValue(0.0f))
133                     .Add( PrimitiveVisualProperty.ScaleDimensions, new PropertyValue(new Vector3(1.0f,1.0f,0.3f)))
134                     .Add( PrimitiveVisualProperty.MixColor, new PropertyValue(new Vector4((245.0f/255.0f), (188.0f/255.0f), (73.0f/255.0f), 1.0f)));
135                 _primitiveVisual =  VisualFactory.Get().CreateVisual( primitiveVisual );
136                 RegisterVisual( PrimitiveVisualPropertyIndex, _primitiveVisual );
137
138                 // Set the depth index for Primitive visual
139                 _primitiveVisual.DepthIndex = PrimitiveVisualPropertyIndex;
140             }
141         }
142
143         public override void OnInitialize()
144         {
145             // Enable Tap gesture on ContactView
146             EnableGestureDetection(Gesture.GestureType.Tap);
147         }
148
149         public override void OnTap(TapGesture tap)
150         {
151             // Change the Color visual of ContactView with some random color
152             Random random = new Random();
153             Color = new Color((random.Next(0, 256) / 255.0f), (random.Next(0, 256) / 255.0f), (random.Next(0, 256) / 255.0f), 1.0f);
154         }
155
156         public override void OnRelayout(Vector2 size, RelayoutContainer container)
157         {
158             // Configure the transform and size of Image visual.
159             PropertyMap imageVisualTransform = new PropertyMap();
160             imageVisualTransform.Add((int)VisualTransformPropertyType.Offset, new PropertyValue(new Vector2(10.0f, 0.0f)))
161                 .Add((int)VisualTransformPropertyType.OffsetPolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Absolute, (int)VisualTransformPolicyType.Absolute)))
162                 .Add((int)VisualTransformPropertyType.SizePolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Absolute, (int)VisualTransformPolicyType.Absolute)))
163                 .Add((int)VisualTransformPropertyType.Size, new PropertyValue(new Vector2(40.0f, 40.0f)))
164                 .Add((int)VisualTransformPropertyType.Origin, new PropertyValue((int)Visual.AlignType.CenterBegin))
165                 .Add((int)VisualTransformPropertyType.AnchorPoint, new PropertyValue((int)Visual.AlignType.CenterBegin));
166             _imageVisual.SetTransformAndSize(imageVisualTransform, size);
167
168             // Configure the transform and size of Text visual.
169             PropertyMap textVisualTransform = new PropertyMap();
170             textVisualTransform.Add((int)VisualTransformPropertyType.Offset, new PropertyValue(new Vector2(0.0f, 0.0f)))
171                 .Add((int)VisualTransformPropertyType.OffsetPolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Relative, (int)VisualTransformPolicyType.Relative)))
172                 .Add((int)VisualTransformPropertyType.SizePolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Absolute, (int)VisualTransformPolicyType.Absolute)))
173                 .Add((int)VisualTransformPropertyType.Size, new PropertyValue(new Vector2(size.X - 100.0f, 50.0f)))
174                 .Add((int)VisualTransformPropertyType.Origin, new PropertyValue((int)Visual.AlignType.Center))
175                 .Add((int)VisualTransformPropertyType.AnchorPoint, new PropertyValue((int)Visual.AlignType.Center));
176             _textVisual.SetTransformAndSize(textVisualTransform, size);
177
178             // Configure the transform and size of Primitive visual.
179             PropertyMap primitiveVisualTransform = new PropertyMap();
180             primitiveVisualTransform.Add((int)VisualTransformPropertyType.Offset, new PropertyValue(new Vector2(size.X - 60.0f, 0.0f)))
181                 .Add((int)VisualTransformPropertyType.OffsetPolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Absolute, (int)VisualTransformPolicyType.Absolute)))
182                 .Add((int)VisualTransformPropertyType.SizePolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Absolute, (int)VisualTransformPolicyType.Absolute)))
183                 .Add((int)VisualTransformPropertyType.Size, new PropertyValue(new Vector2(40.0f, 40.0f)))
184                 .Add((int)VisualTransformPropertyType.Origin, new PropertyValue((int)Visual.AlignType.CenterBegin))
185                 .Add((int)VisualTransformPropertyType.AnchorPoint, new PropertyValue((int)Visual.AlignType.CenterBegin));
186             _primitiveVisual.SetTransformAndSize(primitiveVisualTransform, size);
187
188             // Configure the transform and size of Color visual. This is also the default value.
189             PropertyMap colorVisualTransform = new PropertyMap();
190             colorVisualTransform.Add( (int)VisualTransformPropertyType.Offset, new PropertyValue(new Vector2(0.0f,0.0f)))
191                 .Add((int)VisualTransformPropertyType.OffsetPolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Relative, (int)VisualTransformPolicyType.Relative)))
192                 .Add((int)VisualTransformPropertyType.SizePolicy, new PropertyValue(new Vector2((int)VisualTransformPolicyType.Relative, (int)VisualTransformPolicyType.Relative)))
193                 .Add( (int)VisualTransformPropertyType.Size, new PropertyValue(new Vector2(1.0f, 1.0f)) )
194                 .Add( (int)VisualTransformPropertyType.Origin, new PropertyValue((int)Visual.AlignType.TopBegin) )
195                 .Add( (int)VisualTransformPropertyType.AnchorPoint, new PropertyValue((int)Visual.AlignType.TopBegin) );
196             _colorVisual.SetTransformAndSize(colorVisualTransform, size);
197         }
198     }
199 }