MyContainer

    <MyContainer
        title={"Categories"}
        footer={true}
        navbar={true}
        statusBar={true}
        footerActiveIndex={2}
        error={true}
        errorMessage={"en error occurred"}
        errorOnPress={() => console.log("error button pressed")}>

            {Other Components}

    </MyContainer>


                                    

NavBar

    <NavBar
        title={"Categories"}/>


                                    

MyStatusBar

MyFooter

MyButton

    <MyButton
        buttonText={"Button Text"}
        size={"big"} //Big, Medium, Small, xSmall => Button and text size increase or decrease.
        containerStyle={buttonStyle.container} // Button outside style
        textStyle={buttonStyle.text} // Button text style
        leftIcon={"google"} // left icon that can be changed. Required library https://github.com/oblador/react-native-vector-icons)
        type={"success"} // button types success, danger, warning, info, default
        leftIconStyle={}// left icon style
        rightIconStyle={} // right icon style
        rightIcon={} // right icon that can be changed. Required library https://github.com/oblador/react-native-vector-icons)
        stickyIcon={} // boolean => icon and text to be contiguous
        shadow={}// boolean => enable the shadow
        filled={} // boolean => makes the button filled
        iconBGColor={"green"} // icon background color
    />



                                    

MyInput

    <MyInput
        leftIcon={"user"}
        rightIcon={"user"}
        value={"number"}
        onChangeText={value => console.log("value")}
        iconColor={"green"}
        textArea={false}
        multiline={true}
        editable={true}
        keyboardType={"default"}
        secureTextEntry={false}
        autoCapitalize={"sentences"}
        shadow={false}
        type={"default"}
        containerStyle={{padding: 5}}
        textInputStyle={{color: "grey}}
        rightIconOnPress={() => console.log("rightIconOnPress")}
        leftIconOnPress={() => console.log("leftIconOnPress")}/>

                                    

MyLoadingView

    // screen
    export const HomeScreen = (props) => {
         const {isLoading, loadingText, showLoading, hideLoading} = useContext(LoadingContext);
    }




                                    

MyListItem

    <FlatList
        showsVerticalScrollIndicator={false}
        keyExtractor={(item, index) => index.toString()}
        data={CategoriesData}
        style={[pageContainerStyle]}
        renderItem={({ item, index }) => (

            // category item
            <MyListItem
                key={index}
                style={{marginVertical: 5, borderRadius: 5}}
                onPress={() => {  ... when clicked  }
                imagePath={item["image"]}
                title={item["title"]}/>

    )}/>



                                    

MyPicker

    [
        {
            id: 1,
            title: "test",

        },
        {
            id: 1,
            title: "test",

        },
    ]



        

    <MyPicker
        pickerOnClose={() => this.setState({pickerVisible: false})} // IMPORTANT
        pickerVisible={this.state.pickerVisible}
        search={false}
        data={pickerSortData}
        onSelect={(obj) => {this._onSelect(obj)}}/>




                                    

MyPickerButton

    <MyButton
        buttonText={"Button Text"}
        containerStyle={buttonStyle.container} // Button outside style
        textStyle={buttonStyle.text} // Button text style
        leftIcon={"google"} // left icon that can be changed. Required library https://github.com/oblador/react-native-vector-icons)
        rightIcon={} // right icon that can be changed. Required library https://github.com/oblador/react-native-vector-icons)
        shadow={}// boolean => enable the shadow
        filled={} // boolean => makes the button filled
    />



                                    

MyDialog

    warningDialog("mowega Market Theme", "Message",null,false, false);

    successDialog("mowega Market Theme", "Message","OK","Cancel",true, false);

    errorDialog("mowega Market Theme", "Message","OK",null,false, true);

    defaultDialog("mowega Market Theme", "Message","OK",null,false, false);

                                    

MyCheckBox

     <MyCheckBox
            onPress={() => {this._onPress()}}
            checkedColor={myColors.mainColor}
            checked={this.state.checkboxChecked}
            containerStyle={{alignSelf: "center", right: wp("5%")}}/>



                                    

MyToast

Calls as function. It takes two parameters. First one is text that shows on the screen and second one is duration. The time is 1500 millisecond as default.

     ShowToast.success("Success",2000)//text , duration
     ShowToast.info("Info",2000)//text , duration
     ShowToast.warning("Warning")//text , duration
     ShowToast.error("Error")//text , duration





                                    

MyTitleView

     <MyTitleView
        title={"Transactions"}
        buttonText={"All"}
        buttonOnPress={() => {console.log("button pressed")}}/>



                                    

Router

The service where the router parts of the application are set. The first part of the application. If you want to make changes to the application, first take a look at this section

Pages Folder

All pages within the application are in this folder. Login and non-login are separate.

SampleData Folder

All sample data within the application is here.

Important Information