Giters

Kggmata / picAnimal

This contains the core screen files of react native application picAnimal

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Readme

Quick introduction video

picAnimalKickStarterVideo.mp4

Project Concept

The product (PicAnimal), a mobile app that we designed and created, is presently available on Android and will support IOS in the future. Our target audience consists of 20 to 30 year old students that value ecological conservation and nature, as well as 30 to 40 year old ecologists, zoologists, and taxonomists who work for organizations that protect wildlife.

Recognizing animals from pictures is the main function. Users can manually upload photos or take photos and upload them. The application can then spot any potential animal classes with similarities in the photographs. When a result is clicked, text description, related photos, and related animals are displayed. Users can use this information as a reference to identify the animal species. The images and tags can also be shared with a text description and geo location as a discussion journal log for later view by other users. Users can also view other users' journals. Browse images, text descriptions, and animal tags to like posts, vote on hashtags, and post their own thoughts in the forum.

PicAnimal also has a map functionality that users can share the journal log with location when posting. And therefore users can see the surrounding posts on the map page. At the same time, the map function provides information of the surrounding animal sightings including detailed information including images, text description and related animals similar as image classification, which provides users with convenience.

In addition to the above main features, PicAnimal also has a detailed user statistics record. This includes uploaded photos, posted journals, liked posts or forums, browsing history, etc.

Installation

  • To compile the source code

    • Coding environment

      • Operation System

        • Windows

      • Programming language

        • React JSX

    • Setting up the development environment

      • Follow the instructions on

        • Setting up the development environment · React Native. (n.d.). Retrieved October 17, 2022, from https://reactnative.dev/docs/environment-setup

          Installing dependencies including Android Studio, a JDK, Node, and the command-line interface for React Native.

    • Installing IDE for editing JS file

    • Install all required libraries in ‘/LibrariesUsed.pdf’

    • Initialize a new project and put ‘src’ folder under the root path

    • Available to run.

  • To run the application

    • Physical Device

      • Install the APK file ‘picAnimal.apk’ on Android Devices.

      • Run the Application.

    • Emulator

      • Install a android emulator.
        • for example Blue Stacks
        • BlueStacks—PC/Mac用の優れたモバイルゲームプラットフォーム｜100%安全＆無料. (n.d.). Bluestacks - The Best Android Emulator on PC as Rated by You. Retrieved October 17, 2022, from https://www.bluestacks.com/ja/index.html
      • Install the APK file on Android emulator.
      • Run the Application.

Open source library used

1. 🎈 React Native Camera Kit. (2022). [Objective-C]. Tesla, Inc. https://github.com/teslamotors/react-native-camera-kit (Original work published 2016)

2. Arvidsson, J. (2022). Multi-style fonts [JavaScript]. https://github.com/oblador/react-native-vector-icons (Original work published 2015)

3. Callstack/react-native-paper. (2022). [TypeScript]. Callstack. https://github.com/callstack/react-native-paper (Original work published 2016)

4. Chudziak, M. (2022). @react-native-community/geolocation [Java]. https://github.com/michalchudziak/react-native-geolocation (Original work published 2019)

5. Gorhom, M. (2022). React Native Bottom Sheet [TypeScript]. https://github.com/gorhom/react-native-bottom-sheet (Original work published 2020)

6. Hübel, H. (2022). React-native-fs [C#]. https://github.com/itinance/react-native-fs (Original work published 2015)

7. Invertase/react-native-firebase. (2022). [JavaScript]. Invertase. https://github.com/invertase/react-native-firebase (Original work published 2017)

8. Merrill, D. (2022). React Native Swipeable Item [TypeScript]. https://github.com/computerjazz/react-native-swipeable-item (Original work published 2020)

9. Merrill, D. (2022). React Native Draggable FlatList [TypeScript]. https://github.com/computerjazz/react-native-draggable-flatlist (Original work published 2018)

10. React Native. (2022). [JavaScript]. Meta. https://github.com/facebook/react-native (Original work published 2015)

11. React Native Async Storage. (2022). [TypeScript]. AsyncStorage. https://github.com/react-native-async-storage/async-storage (Original work published 2019)

12. React Native Image Resizer. (2022). [Java]. BAM. https://github.com/bamlab/react-native-image-resizer (Original work published 2015)

13. React Navigation 6. (2022). [TypeScript]. React Navigation. https://github.com/react-navigation/react-navigation (Original work published 2017)

14. React-native-linear-gradient. (2022). [C++]. react-native-linear-gradient. https://github.com/react-native-linear-gradient/react-native-linear-gradient (Original work published 2015)

15. React-native-maps. (2022). [Objective-C]. react-native-maps. https://github.com/react-native-maps/react-native-maps (Original work published 2015)

16. React-native-safe-area-context. (2022). [TypeScript]. Th3rdwave. https://github.com/th3rdwave/react-native-safe-area-context (Original work published 2019)

17. Sahoo, S. (2022). React Native Tab View [TypeScript]. https://github.com/satya164/react-native-tab-view (Original work published 2016)

18. Software-mansion/react-native-gesture-handler. (2022). [TypeScript]. Software Mansion. https://github.com/software-mansion/react-native-gesture-handler (Original work published 2016)

19. Software-mansion/react-native-reanimated. (2022). [TypeScript]. Software Mansion. https://github.com/software-mansion/react-native-reanimated (Original work published 2018)

20. 黄子毅. (2022). Ascoders/react-native-image-viewer [TypeScript]. https://github.com/ascoders/react-native-image-viewer (Original work published 2016)

APIs used

1. API:Main page—MediaWiki. (n.d.). Retrieved October 15, 2022, from https://www.mediawiki.org/wiki/API:Main_page

2. Flickr 服務：**Flickr API: flickr.photos.search. (n.d.). Retrieved October 15, 2022, from https://www.flickr.com/services/api/flickr.photos.search.html

3. Science, c=AU; o=The S. of Q. ou=Environment and. (n.d.). Qld wildlife data API [Text]. corporateName=The State of Queensland; jurisdiction=Queensland. Retrieved October 15, 2022, from https://www.data.qld.gov.au/dataset/qld-wildlife-data-api

4. Vision AI | Cloud Vision API | Google Cloud. (n.d.). Retrieved October 14, 2022, from https://cloud.google.com/vision

5. 百度智能云-智能时代基础设施. (n.d.). Retrieved October 14, 2022, from https://cloud.baidu.com/

About

This contains the core screen files of react native application picAnimal

Languages

Language:JavaScript 100.0%