added search bar

This commit is contained in:
hariroshan 2023-01-09 15:12:56 +05:30
parent d27b91acdf
commit f20529f0ab
5 changed files with 56 additions and 36 deletions

View File

@ -1,4 +1,4 @@
module Native exposing (activityIndicator, button, datePicker, formattedString, htmlView, image, label, listPicker, progress, scrollView, span)
module Native exposing (activityIndicator, button, datePicker, formattedString, htmlView, image, label, listPicker, progress, scrollView, span, searchBar)
import Html exposing (Attribute, Html)
@ -61,3 +61,8 @@ progress =
scrollView : List (Attribute msg) -> List (Html msg) -> Html msg
scrollView =
buildElement "ns-scroll-view"
searchBar : List (Attribute msg) -> List (Html msg) -> Html msg
searchBar =
buildElement "ns-search-bar"

View File

@ -893,3 +893,18 @@ scrollableWidth =
verticalOffset : String -> Attribute msg
verticalOffset =
attribute "vertical-offset"
hint : String -> Attribute msg
hint =
attribute "hint"
textFieldBackgroundColor : String -> Attribute msg
textFieldBackgroundColor =
attribute "text-field-background-color"
textFieldHintColor : String -> Attribute msg
textFieldHintColor =
attribute "text-field-hint-color"

View File

@ -264,23 +264,21 @@ let scrollView =
]->Belt.Array.map(dashed),
]->Belt.Array.concatMany
// Js.log("****************************")
// [
// "horizontalOffset",
// "isScrollEnabled",
// "orientation",
// "scrollBarIndicatorVisible",
// "scrollableHeight",
// "scrollableWidth",
// "verticalOffset",
// ]
// ->Belt.Array.map(dashed)
// ->Belt.Array.forEach(prop =>
// Js.log(
// `
// ${camelCased(prop)} = attribute "${prop}"
// `,
// )
// )
let searchBar =
[
view,
["hint", "text", "textFieldBackgroundColor", "textFieldHintColor"]->Belt.Array.map(dashed),
]->Belt.Array.concatMany
// Js.log("****************************")
Js.log("****************************")
["hint", "text", "textFieldBackgroundColor", "textFieldHintColor"]
->Belt.Array.map(dashed)
->Belt.Array.forEach(prop =>
Js.log(
`
${camelCased(prop)} = attribute "${prop}"
`,
)
)
Js.log("****************************")

View File

@ -138,6 +138,17 @@ module ScrollView = {
let handler: Types.handler = buildHandler(new, Constants.scrollView, Helper.addView)
}
module SearchBar = {
%%private(
@module("@nativescript/core") @new
external new: unit => Types.nativeObject = "SearchBar"
)
let tagName = "ns-search-bar"
let handler: Types.handler = buildHandler(new, Constants.searchBar, Helper.addView)
}
let all: array<Types.customElement> = [
{
tagName: Label.tagName,
@ -183,4 +194,8 @@ let all: array<Types.customElement> = [
tagName: ScrollView.tagName,
handler: ScrollView.handler,
},
{
tagName: SearchBar.tagName,
handler: SearchBar.handler,
},
]

View File

@ -201,22 +201,9 @@ counter model =
detailsPage : Model -> Page.Page Msg
detailsPage model =
Page.page []
(
Layout.scrollView [ ]
[ -- Event.on "navigatedTo" (D.succeed Destory)
Layout.asElement <|
Layout.gridLayout [ NA.rows "200 200 200 200 200 200 200 200 200 200" ]
[ Native.label [ NA.row "0", NA.text "row content goes here..." ] []
, Native.label [ NA.row "1", NA.text "row content goes here..." ] []
, Native.label [ NA.row "2", NA.text "row content goes here..." ] []
, Native.label [ NA.row "3", NA.text "row content goes here..." ] []
, Native.label [ NA.row "4", NA.text "row content goes here..." ] []
, Native.label [ NA.row "5", NA.text "row content goes here..." ] []
, Native.label [ NA.row "6", NA.text "row content goes here..." ] []
, Native.label [ NA.row "7", NA.text "row content goes here..." ] []
, Native.label [ NA.row "8", NA.text "row content goes here..." ] []
, Native.label [ NA.row "9", NA.text "row content goes here..." ] []
]
-- Event.on "navigatedTo" (D.succeed Destory)
(Layout.stackLayout []
[ Native.searchBar [ NA.hint "Enter search term here..", NA.text "Hello" ] []
]
)