Hello, This is my first Guide.
In this guide i will be showing you how to create overlapping design using dynamic component.
First lets see the designer view.
Preview
You will need
- Vertical arrangement which is the main layout.
Properties of main layout
{ Align horizontal: left:1
Align vertical: top:1
Height and Width: Fill parent} - Inside the main layout you have the Horizontal arrangement.
Properties;
{ Align horizontal: left:1
Align vertical: top:1
Height: auto
Width: Fill parent} - Inside the Horizontal arrangement you have the Cardview.
properties;
leave it as it is except for corner radius, Height and Width.
{Corner radius: 25
Height:120px
Width: 100px} - Inside the horizontal arrangement you have your Image. The reason why we have the image inside the horizontal arrangement is because we want the image to overlap on the cardview component, for instance if we have the image inside the cardview the image will not overlap instead it hides inside the cardview.
Properties;
{ Height and Width: 50px}
In this preview design, we want to see how the design will look like using the dynamic component.
Let’s see the blocks.
First you need to know the use of Decoration component. For this design we will be requiring the Decoration.Set Margin block, you can see in this block we have two sockets which are the component and values. Margin is a way for a component to enforce some distance from others components. By specifying margin for a component, we say that keep this much distance from this component. Use single number like 5 to specify padding for top, left, bottom, right. You can also use 4 different numbers like 5,0,10,0 for top, left, bottom right. In our case were using 50,-30,120,0.
Outcome design.
Now that we have the idea how the view will look like using the dynamic component. Lets get started
Designer view
Drag out your Horizontal scroll arrangement. This is where our view will be created. The next is to set our property.
Align vertical: center:2
Align horizontal: left:1
Height: auto;
Width: Fill parent.
Now lets jump into the blocks
Below is the blocks. Make sure you follow all the properties of each component, assign them where necessary.
AIA
Overlapdynamic.aia (30.3 KB)
APK Overlapdynamic.apk (5.2 MB)
Yes it can be done with dynamic component 
Happy Koding…
