mars885/gamedge

An Android application for browsing video games and checking the latest gaming news from around the world.

Gamedge

An Android application for browsing video games and checking the latest gaming news from around the world.

Built entirely using the Jetpack Compose.

The aim of this project is to showcase the latest trends in Android development by utilizing the best practices, libraries, and tools to develop a fully-fledged Android application.

Contents

• Demonstration
  • Videos
  • Screenshots
• Tech Stack
• Architecture
• Development Setup
  • IGDB
  • Gamespot
• Download
• Contribution
• Questions
• License

Demonstration

Videos

Demo 1

demo1.mp4

Demo 2

demo2.mp4

Demo 3

demo3.mp4

Screenshots

Tech Stack

• Kotlin - First class and official programming language for Android development.
• Jetpack Compose - Android’s modern toolkit for building native UI.
• Coroutines and Flow - Official Kotlin's tooling for performing asynchronous work.
• MVVM/MVI Architecture - Official recommended architecture for building robust, production-quality apps.
• Android Jetpack - Jetpack is a suite of libraries to help developers build state-of-the-art applications.
  • Navigation Compose - Navigation Compose is a framework for navigating between composables while taking advantage of the Navigation component’s infrastructure and features.
  • ViewModel - The ViewModel is designed to store and manage UI-related data in a lifecycle conscious way.
  • StateFlow - StateFlow is a state-holder observable flow that emits the current and new state updates to its collectors.
  • Room - The Room library provides an abstraction layer over SQLite to allow for more robust database access.
  • DataStore - DataStore is a data storage solution that stores key-value pairs or typed objects with protocol buffers.
  • Dagger Hilt - Hilt is a dependency injection library for Android.
  • MotionLayout - MotionLayout allows you to create beautiful animations in your app without too much hassle.
  • Custom Tabs - Custom Tabs is a browser feature that gives apps more control over their web experience.
• Accompanist - A collection of extension libraries for Jetpack Compose.
• OkHttp - An HTTP client for making network calls.
• Retrofit - A library for building REST API clients.
• KotlinX Serialization - A multiplatform Kotlin serialization library.
• Coil - An image loading library.
• Hilt Binder - An annotating processing library that automatically generates Dagger Hilt's @Binds methods.
• Kotlin Result - A multiplatform Result monad for modelling success or failure operations.
• Detekt - A static code analysis library for Kotlin.
• Ktlint - A library for formatting Kotlin code according to official guidelines.
• Testing - The app is currently covered with unit tests and instrumentation tests.
  • JUnit - JUnit is a unit testing framework for the Java programming language.
  • Truth - Truth is a library providing fluent assertions for Java and Android.
  • MockK - MockK is a mocking library for Kotlin.
  • Coroutines Test - A library for testing Kotlin coroutines.
  • Turbine - A testing library for Kotlin Flows.
  • Dagger Hilt Test - A testing library for modifying the Dagger bindings in instrumented tests.
  • Room Testing - A library for testing Room migrations.
  • MockWebServer - A scriptable web server for testing HTTP clients.
• Gradle's Kotlin DSL - Gradle’s Kotlin DSL is an alternative syntax to the Groovy DSL with an enhanced editing experience.
• buildSrc - A special module within the project to manage dependencies and whatnot.

For more information about used dependencies, see this file.

Architecture

Development Setup

You'll need to supply API/client keys for the various services that the app uses in order to build the application.

IGDB

IGDB is a website dedicated to combining all the relevant information about games into a comprehensive resource for gamers everywhere. This is the main API that the app uses to fetch information about pretty much any video game there is.

Check this link on how to obtain a client ID and secret. Once you have obtained the keys, you can set them in your ~/.gradle/gradle.properties:

TWITCH_APP_CLIENT_ID=yout_client_id_here
TWITCH_APP_CLIENT_SECRET=your_client_secret_here

Gamespot

Gamespot is a video gaming website that provides news, reviews, previews, downloads, and other information on video games. The app uses its API to solely retrieve the latest news in the gaming world.

Check this link on how to obtain an API key. Once you have obtained the key, you can set it in your ~/.gradle/gradle.properties:

GAMESPOT_API_KEY=your_api_key_here

Download

Go to the Releases to download the latest APK.

Contribution

See the CONTRIBUTION.md file.

Questions

If you have any questions regarding the codebase, hit me up on Twitter.

License

Gamedge is licensed under the Apache 2.0 License.

gamedge's Issues

Use java-test-fixtures plugin

Incorporate the java-test-fixtures plugin to share common testing code across the project and delete commons-testing module, which acts as a replacement for it at this point.

Unfortunately, the plugin, at the moment of writing this issue, is only available for pure java and kotlin modules, meaning it cannot be used for android modules. There is a feature request on the Google Issue Tracker to support java-test-fixtures plugin.

A good resource about what text-fixtures-plugin is and what it can do can be found here.

Try out disabling Jetifier to improve build time

Resources:

• Disabling Jetifier

Keep the `igdb-api` JSON schema in sync with the backend

The video entities coming from the IGDB API do not contain name field sometimes, which causes an error when trying to load a game inside the game info screen, since that field is required in the JSON schema.

Another issue arises in terms of what to show on the UI side. Two solutions:

• Display some kind of placeholder text, like Video or Trailer.
• Make the video's thumbnail take the height of the missing title

Create a lint check for verifying imports inside `feature-*` domain modules

Each feature-* module can contain three subpackages called domain, data, and presentation. Ideally, the domain layer should not reference anything that lives inside data or presentation modules.

Therefore, to automate this, a lint check can be created to enforce this behavior.

Refactor multi-modular approach so that each module will contain domain, data, and presentation packages

Resources:

• Multiple ways of defining Clean Architecture layers

Enforce trailling comma styling rule

Start enforing trailling comma styling rule as soon as ktlint starts supporting it. It seems at the moment that the rule is experimental. As soon as it is deemed stable, consider enabling it.

The issue to track about its support.

Remove no longer needed Kotlin compiler flags

Check what Kotlin compiler flags are no longer needed to be specified here and delete them.

Create a custom `@Preview` annotation as a shortcut for both light & dark themes

Apparently, starting from Compose 1.2, it's possible to create a single annotation for previewing multiple configurations of a particular composable instead of duplicating @Preview multiple times everywhere.

However, as of Jetpack Compose version 1.2 and Android Studio Chipmunk, preview just don't work. Therefore, as soon as previews get fixed, create a single preview annotation and use it for previewing composables. Something like this:

@Preview
@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES)
annotation class GamedgePreview

Then, use it like so:

@GamedgePreview
@Composable
private fun GameInfoLoadingStatePreview() {
  // ...
}

Implement OkHttp's Authenticator

Migrate from using Accompanist's insets to Compose's out of the box solution

Starting from the 1.2.0 version, the Compose comes with ready-to-be used APIs for managing insets.

Resources:

• Migration Docs

Refactor casting `MutableStateFlow` to `StateFlow` by using `asStateFlow` extension

More info here.

Drop SplashActivity alltogether

Resources:

• Splash screens
• Migrate your existing splash screen implementation to Android 12 and higher

Preload images inside the image viewer screen

The ViewPager2 class has the method setOffscreenPageLimit that allows to preload a specified number of items on either side.

Before the Jetpack Compose migration, it was used to preload images inside the image viewer screen.

However, the Accompanist's analogue of the ViewPager2, does not currently support that. Consider adding it as soon as support for this feature is released.

The issue to track on the Accompanist's side.

Remove font padding from the game info header's second title

In the XML world, TextView allows disabling the font padding by specifying includeFontPadding="false". This was used by the second title of the game info header to remove any extra space between the first title & second one.

However, as of 1.1.1 version of the Jetpack Compose, it's not possible to do that. As of the 1.2.0-beta01, the support for that has been added. As soon as the project gets updated to use 1.2.0 version of the Jetpack Compose, consider removing the font padding, just like it was before the migration to Compose.

Consider adding navigation rail component for big screens

Resources:

• Material Design Doc
• Material Components: Navigation Rail
• Jetpack Compose Navigation Rail

Consider adding a light theme

Create a use case for generating game's different URLs and refactor `GameInfoViewModel` to use it

Currently, when a user is on the game info screen and clicks on an image, we need to pass a ready-to-be consumed URL of a clicked image to the image viewer screen. The logic for getting a particular image URL is embedded inside the GameInfoViewModel (like here, here, and here).

It looks quite dirty and a separate use case named something like GetGameImageUrlsUseCase is needed to be created and then GameInfoViewModel refactored to use it.

AS always shows `Duplicate content roots detected` popup when Gradle sync is performed

At the moment of this writing, KSP requires us to specify where the generated code lives. If we were to omit it, the generated code does not get picked up and the build fails.

The solution, however, causes the popup with text "Duplicate content roots detected" appear after every Gradle sync.

Firstly, follow google/ksp#37 issue and see whether a better solution is provided.
Second, follow AS issue for Duplicate content roots detected popup appearing.

Add an ability to change the app's theme inside the app

It's a good practice to allow users to change the theme of the app according to their preference.

Therefore, a setting needs to be added to implement this requirement.

About common-domain module

Hi thanks for a great sample about modular application with compose. I'm curious about why are you seperate common-domain instead of adding domain package in every feature modules?

Consider replacing toasts with snackbars for showing messages

Migrate to Jetpack Compose

Jetpack Compose is the new UI framework for Android that is going to replace the current one in the near future.

Migrate to using MutableStateFlow.update method when updating values

Resources:

• Make sure to update your StateFlow safely in Kotlin!
• Atomic Updates on MutableStateFlow

Use horizonal sliding animations

For the horizontal sliding animations to work properly, they require specifying the zIndex for both the entering & exiting animations.

However, from the research done, it seems like it's not possible to specify it inside AnimatedNavHost.enterTransition, AnimatedNavHost.exitTransition, AnimatedNavHost.popEnterTransition, and AnimatedNavHost.popExitTransition as of 0.23.1 version of the Accompanist library.

The Accompanist's issue can be tracked here.

The project is using an incompatible version (7.0.0-beta05) of the Android Gradle plugin.

I'm trying to build the project with new Android Studio (Arctic Fox), but it says (The project is using an incompatible version (7.0.0-beta05) of the Android Gradle plugin.), and If I upgrade it manually Hilt doesn't work properly, I keep getting @HiltAndroidApp base class must extend Application, tried cleaning the project, invalidate cache and restart but no success.

Delete redunant commens inside resource files

Remove comments like <!-- GamesDiscovery --> and <!-- LikedGames --> from resource files.

Translations

do you have plans to implement translations? there are services like webblate and crowdin.

Rename UI model classes & mappers to have a `UiModel` & `UiModelMapper` suffixes

Animate game liking/unliking using animated vector drawable

Before the migration to the Jetpack Compose, the action of liking & unliking a game by clicking the like button was animated using the animated vector drawable.

However, the latest version of the Jetpack Compose (1.1.1 as of now) does not support that. Consider adding it back once the support comes along.

The issue on the google issue tracker about this problem.

Could not perform the request

Animate the game info header using the MotionLayout

The latest release of MotionLayout for Jetpack Compose, 1.1.0-alpha02, does not seem to support OnSwipe gestures for the LazyColumn composable. Try again as soon as the support for that comes out.

Monitoring the releases can be done here.

Disable swiping of artworks when game info header is collapsed

The ViewPager2 class has the support to enable/disable swiping by calling the method setUserInputEnabled(boolean isEnabled).

Before the migration, whe the game info header was collapsed, the scrolling of artworks was disabled like this.

However, the Accompanist's analogue, as of the 0.23.1, does not support doing that. Starting from the 0.24.1-alpha, the support has been added.

Consider using that as soon as #139 issue is resolved & the version of Accompanist gets updated inside the project.

Extract use cases combination logic into a separate use case inside the `GameInfoViewModel`

Refactor the GameInfoViewModel by extracting the logic for loading game's information into a separate use case named something like GetGameInfoUseCase.