Totara Mobile has two levels of customisation, customising the look and feel, and extending the app.
Look and feel customisation
In order to brand the Totara Mobile app with minimal changes, use the official theming product documentation as a reference.
Extend the app
After exploring the theming product documentation, in order to extend the mobile app, you may have the following main options to change:
- App unique application ID
- App icons
- Advanced theming using TotaraTheme
- Caching
- Default language strings
Using a unique app ID will ensure you do not overwrite the official Totara Mobile app from your app drawer. In the same way, a unique icon can visually identify your app.
iOS
You can modify iOS icons in this folder: ios/TotaraMobileApp/Images.xcassets.
For application ID, open XCode, in the identity section, change the Bundle Identifier to your app id.
Android
You can modify iOS icons in this folder: android/app/src/main/res/.
For Android application ID, change the default Config.applicationid inside android/app/build.gradle.
GraphQL
For any minor changes it would be best to extend the persisted queries as described in the GraphQL documentation, for any changes that are outside the possibilities of the existing schema there are two methods:
The first (easier) way is to create a lightweight plugin that holds the schema and queries you need, and that implements any custom resolver or formatter classes that you will need.
The second (safer) way, is to fork the totara_mobile plugin. This will be a bit of work up front, but it will allow you much more control in the long term, and if the totara_mobile plugin changes your custom app code will still work.
In either case, your queries can alias core GraphQL queries (see /totara/mobile/webapi/mobile/scorm.graphql) or if you need new properties you can implement your own resolvers to extend core (see /totara/mobile/webapi/mobile/course.graphql and the associated resolvers in /totara/mobile/classes/webapi).
TotaraTheme object
TotaraTheme object has the main properties so you can fully customise your app. It can be found in this path: src/totara/theme/Theme.ts
Caching
In order to extend caching, you may check the caching features of Apollo client. Please note that by default, Apollo Client's fetch policy is cache-first.
Default language strings
You should be able to customise your language strings in the Totara Mobile plugin. However, some default language strings are predefined because you will need to show some screens before the user connects to the server. You can find default language strings files in this path: src/totara/locale/languages.