Skip to content

Commit 7969a8a

Browse files
Update Readme
1 parent 5a75c57 commit 7969a8a

File tree

2 files changed

+32
-21
lines changed

2 files changed

+32
-21
lines changed

README.md

Lines changed: 29 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -26,51 +26,62 @@ XML widget to create the Material Design Floating Action Button for Android Nati
2626
<label text="{{ name }}" textWrap="true" fontSize="18" margin="20" />
2727
</list-view.itemTemplate>
2828
</list-view>
29-
<android row="1">
3029
<FAB:fab tap="fabTap"
31-
row="1"
32-
icon="res://ic_add_white"
33-
backColor="#ff4081"
34-
rippleColor="#f1f1f1"
35-
class="fab-button" />
36-
</android>
30+
row="1"
31+
icon="res://ic_add_white"
32+
backColor="#ff4081"
33+
rippleColor="#f1f1f1"
34+
class="fab-button" />
3735
</grid-layout>
3836
</Page>
3937
```
38+
PLEASE NOTE: The fab is on the same **row number** as the listview
39+
***
4040

4141
#### CSS
4242
I recommend the following CSS styles.
4343
```CSS
4444
.fab-button {
4545
height: 70;
46-
horizontal-align: right;
47-
vertical-align: bottom;
4846
margin: 15;
47+
horizontal-align: right; /* Android Only */
48+
vertical-align: bottom; /* Android Only */
49+
background-color: #ff4081; /* iOS Only */
50+
color: #fff; /* iOS Only */
4951
}
5052
```
5153

54+
***
55+
5256
#### JS
5357

5458
```JS
55-
function fabTap(args) {
56-
console.log('tapped');
57-
}
59+
function fabTap(args) {
60+
console.log('tapped');
61+
}
5862
exports.fabTap = fabTap;
5963
```
6064

61-
#### Attributes
65+
***
66+
67+
## Attributes
6268
**backColor** - optional
6369

64-
Attribute to specify the background color of the FAB
70+
Background color of the FAB
71+
72+
### Android Specific Attributes
73+
**icon** - required
6574

66-
**rippleColor** - optional
75+
Icon to use for the FAB button, supports the same image source options that NativeScript images support.
76+
77+
**rippleColor** - optional
78+
79+
Ripple color on lollipop devices, it will fill the FAB on pre-lollipop devices
6780

68-
Attribute to set the ripple color on lollipop devices, it will fill the FAB on pre-lollipop devices
6981

70-
**icon** - required
7182

72-
Attribute to specify which icon to use for the FAB button, supports the same image source options that NativeScript images support.
7383

7484
### Contributors
7585

7686
- L�zaro Danillo [lazaromenezes](https://github.com/lazaromenezes)
87+
- Steve McNiven-Scott [sitefinitysteve](https://github.com/sitefinitysteve) - iOS

demo/app/app.css

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,11 @@ button {
1616
}
1717

1818
.fab-button {
19-
height: 75;
20-
width: 75;
19+
height: 50;
20+
width: 50;
2121
margin: 15;
2222
horizontal-align: right;
23-
vertical-align: top;
23+
vertical-align: bottom;
2424
color: #FFF;
2525
/*background-color: #ff4081;*/
2626
}

0 commit comments

Comments
 (0)