App Codex Version: 1.0.0

Components

GroupPhotosScreen

<GroupPhotosScreen />

Constructor

# <GroupPhotosScreen />

You can use this component to display Groups Photos Screen in your custom screen.

Properties:
Name Type Attributes Description
groupId Number <optional>

Id of group to display
searchTerm String <optional>

If the group is not yet available in the app state, the component will attempt to load a list of groups. You can use this field to search for the specific group you want to load instead of loading a list of groups.
hideNewPhotoButton Boolean <optional>

Use true to hide the new photo button in the photos screen.
hidePhotoBackButton Boolean <optional>

Use true to hide the back button in the photos screen.
hidePhotoNavigationHeader Boolean <optional>

Use true to hide the screen title container in the photos screen.
hideSelectButton Boolean <optional>

Use true to hide the select button in the photos screen.
hideAlbumBackButton Boolean <optional>

Use true to hide the back button in the albums screen.
hideAlbumNavigationHeader Boolean <optional>

Use true to hide the screen title container in the albums screen.
hideNewAlbumButton Boolean <optional>

Use true to hide the new photo button in the albums screen.
screenTitle String <optional>

List screen title
LoadingComponent ReactComponent <optional>

Use this to display your own loading component while the screen is loading
Example
//In custom_code/components/MyCustomScreen.js...

import React from 'react';
import { View, Text } from 'react-native';
import GroupPhotosScreen from "@src/containers/Custom/Group/GroupPhotosScreen";
const MyCustomScreen = (props) => {

    const groupId = 6;

    return <>
        <GroupPhotosScreen {...props}
            groupId={groupId}
            screenTitle="Group Photos"
            hidePhotoBackButton={true}
            hideSelectButton={true}
            hideNewPhotoButton={false}
            hideAlbumBackButton={true}
            hideNewAlbumButton={true}
            // hideAlbumNavigationHeader={true}
            // hidePhotoNavigationHeader={true}
            LoadingComponent={<View style={{ flex: 1, alignSelf: "center", justifyContent: "center" }}>
                <Text>Loading, please wait...</Text>
            </View>
            }

        />
    </>

}


export default MyCustomScreen;

//In custom_code/index.js...
import MyCustomScreen from "./components/MyCustomScreen";
export const applyCustomCode = externalCodeSetup => {

 externalCodeSetup.navigationApi.addNavigationRoute(
   "book",
   "BookScreen",
   MyCustomScreen,
   "All"
 );
 externalCodeSetup.navigationApi.addNavigationRoute(
   "book",
   "BookScreen",
   MyCustomScreen,
   "Main"
 );
}