on master help sign in
Refactor textField to support watermark and use smallImageButton for send and settings
5387e6diko
client/Assets/Images/send.pngnew file

Binary file not shown.

client/Buttons.fs+3−18
@@ -131,13 +131,8 @@ module Buttons =
131 .onTapped (fun _ -> msg)
131 .onTapped (fun _ -> msg)
132 }
132 }
133
133
134− let smallImageButton (img: byte[] option) (msg: 'msg) =
134+ let smallImageButton (asset: string) (msg: 'msg) =
135− let key =
136− match img with
137− | None -> "img-button"
138− | Some i -> $"img-button-{hash i}"
135+ Component($"img-button-{asset}") {
139−
140− Component(key) {
141 let! pressed = Context.State(false)
136 let! pressed = Context.State(false)
142 let offset = if pressed.Current then 2. else 4.
137 let offset = if pressed.Current then 2. else 4.
143
138
@@ -146,17 +141,7 @@ module Buttons =
146
141
147 Rectangle().fill (SolidColorBrush(Colors.White))
142 Rectangle().fill (SolidColorBrush(Colors.White))
148
143
149− match img with
144+ Image(asset, Stretch.Uniform).width(24.).height(24.).center ()
150− | None ->
151− ViewBox(
152− Image("avares://Skrepka/Assets/Images/user.png", Stretch.Uniform)
153− .width(32.)
154− .height(32.)
155− .margin (8.)
156− )
157−
158− | Some i ->
159− Image(Styles.cachedBitmap i, Stretch.UniformToFill).width(32.).height(32.).clipToBounds (true)
160
145
161 borderRect ()
146 borderRect ()
162 })
147 })
client/TextFields.fs+2−2
@@ -29,9 +29,9 @@ module TextFields =
29 .Name("PART_BorderElement"))
29 .Name("PART_BorderElement"))
30 [ setter ] ]
30 [ setter ] ]
31
31
32− let textField value msg =
32+ let textField watermark value msg =
33 (Grid() {
33 (Grid() {
34− TextBox(value, msg).fontFamily(Constants.fontFamily).verticalAlignment(VerticalAlignment.Stretch).verticalContentAlignment(VerticalAlignment.Center).background(SolidColorBrush(Colors.White))
34+ TextBox(value, msg).watermark(watermark).fontFamily(Constants.fontFamily).verticalAlignment(VerticalAlignment.Stretch).verticalContentAlignment(VerticalAlignment.Center).background(SolidColorBrush(Colors.White))
35 Rectangle().stroke(Colors.Black).strokeThickness (4.)
35 Rectangle().stroke(Colors.Black).strokeThickness (4.)
36 }).styles (whiteBg ())
36 }).styles (whiteBg ())
37
37
client/ViewAddContact.fs+1−1
@@ -52,7 +52,7 @@ module ViewAddContact =
52 if hasError then
52 if hasError then
53 errorTextField cpk (fun key -> SetPage(AddContact(key)))
53 errorTextField cpk (fun key -> SetPage(AddContact(key)))
54 else
54 else
55− textField cpk (fun key -> SetPage(AddContact(key)))
55+ textField "" cpk (fun key -> SetPage(AddContact(key)))
56
56
57
57
58 if isValid then
58 if isValid then
client/ViewChat.fs+2−6
@@ -87,15 +87,11 @@ module ViewChat =
87 (Grid([ Dimension.Auto; Dimension.Star; Dimension.Auto ], [ Dimension.Auto ]) {
87 (Grid([ Dimension.Auto; Dimension.Star; Dimension.Auto ], [ Dimension.Auto ]) {
88 (backButton (SetPage Conversations)).gridColumn (0)
88 (backButton (SetPage Conversations)).gridColumn (0)
89
89
90− TextBox(compose, fun text -> SetPage(Chat(pk, text)))
90+ (textField "Message..." compose (fun text -> SetPage(Chat(pk, text))))
91− .watermark("Message...")
92− .fontFamily(Constants.fontFamily)
93− .verticalAlignment(VerticalAlignment.Stretch)
94− .verticalContentAlignment(VerticalAlignment.Center)
95 .margin(8.)
91 .margin(8.)
96 .gridColumn (1)
92 .gridColumn (1)
97
93
98− (smallButton Primary "Send" DoSend).gridColumn (2)
94+ (smallImageButton "avares://Skrepka/Assets/Images/send.png" DoSend).gridColumn (2)
99 })
95 })
100 .horizontalAlignment (HorizontalAlignment.Stretch)
96 .horizontalAlignment (HorizontalAlignment.Stretch)
101
97
client/ViewConversations.fs+2−2
@@ -91,8 +91,8 @@ module ViewConversations =
91 .centerText ()
91 .centerText ()
92
92
93 (Grid([ Dimension.Auto; Dimension.Star; Dimension.Auto ], [ Dimension.Auto ]) {
93 (Grid([ Dimension.Auto; Dimension.Star; Dimension.Auto ], [ Dimension.Auto ]) {
94− (smallImageButton None (SetPage Settings)).gridColumn (0)
94+ (smallImageButton "avares://Skrepka/Assets/Images/user.png" (SetPage Settings)).gridColumn (0)
95− (textField "" Search).margin(8.).verticalAlignment(VerticalAlignment.Stretch).gridColumn (1)
95+ (textField "" "" Search).margin(8.).verticalAlignment(VerticalAlignment.Stretch).gridColumn (1)
96 (smallTextButton "+" (SetPage(AddContact("")))).gridColumn (2)
96 (smallTextButton "+" (SetPage(AddContact("")))).gridColumn (2)
97 })
97 })
98 .horizontalAlignment (HorizontalAlignment.Stretch)
98 .horizontalAlignment (HorizontalAlignment.Stretch)
client/ViewEditProfile.fs+1−1
@@ -21,7 +21,7 @@ module ViewEditProfile =
21 imageButton photo DoPickPhoto
21 imageButton photo DoPickPhoto
22
22
23 TextBlock("Name").fontFamily(Constants.fontFamily).fontWeight(FontWeight.Bold).margin (0, 24, 0, -8)
23 TextBlock("Name").fontFamily(Constants.fontFamily).fontWeight(FontWeight.Bold).margin (0, 24, 0, -8)
24− (textField displayName (fun text -> SetPage(EditProfile(text, bio, photo)))).margin (0, 0, 0, 8)
24+ (textField "" displayName (fun text -> SetPage(EditProfile(text, bio, photo)))).margin (0, 0, 0, 8)
25
25
26
26
27 TextBlock("Bio").fontFamily(Constants.fontFamily).fontWeight(FontWeight.Bold).margin (0, 0, 0, -8)
27 TextBlock("Bio").fontFamily(Constants.fontFamily).fontWeight(FontWeight.Bold).margin (0, 0, 0, -8)