Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/js-bhavyansh/anime_app
An anime app using Jetpack Compose, Kitsu API, and MVVM. Displays trending anime with shared element transitions. Includes splash and onboarding screens. Built with Kotlin and Hilt.
https://github.com/js-bhavyansh/anime_app
android anime coil dependency-injection hilt jetpack-compose kitsu-api kotlin mvvm-architecture shared-element-transition
Last synced: 3 days ago
JSON representation
An anime app using Jetpack Compose, Kitsu API, and MVVM. Displays trending anime with shared element transitions. Includes splash and onboarding screens. Built with Kotlin and Hilt.
- Host: GitHub
- URL: https://github.com/js-bhavyansh/anime_app
- Owner: js-bhavyansh
- Created: 2024-06-18T15:51:30.000Z (7 months ago)
- Default Branch: master
- Last Pushed: 2024-08-20T16:33:57.000Z (5 months ago)
- Last Synced: 2024-11-18T07:27:59.706Z (2 months ago)
- Topics: android, anime, coil, dependency-injection, hilt, jetpack-compose, kitsu-api, kotlin, mvvm-architecture, shared-element-transition
- Language: Kotlin
- Homepage:
- Size: 1.99 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Anime App
This is an Android application that fetches and displays trending anime information using the Kitsu API. The app includes a splash screen, an onboarding screen, and uses the MVVM architecture. It also incorporates shared elements for smooth transitions between screens.
## Features
- Fetches trending anime information from the Kitsu API
- Splash screen
- Onboarding screen
- MVVM architecture
- Shared element transitions## Libraries and Tools
- Jetpack Compose
- Kitsu API
- Hilt for Dependency Injection
- Coil for image loading
- kotlinx.serialization for navigation## Screenshots
### Dark Mode :
### Light Mode :
## Getting Started
### Prerequisites
- Android Studio
- Kotlin### Installation
1. Clone the repository:
```bash
git clone https://github.com/Bhavyansh03-tech/Anime_App.git
```
2. Open the project in Android Studio.
3. Build the project and run it on an emulator or a physical device.## Code Overview
### ViewModel
`AnimeViewModel` is responsible for fetching anime details and holding the data for `AnimeScreen`.
```kotlin
@HiltViewModel
class AnimeViewModel @Inject constructor(
private val api: KitsuRepository
) : ViewModel() {private var _anime = MutableStateFlow(null)
val anime = _anime.asStateFlow()fun fetchAnime(id: Int) {
viewModelScope.launch {
_anime.update { api.getAnime(id) }
}
}
}
````TrendingAnimeViewModel` is responsible for fetching anime details and holding the data for `TrendingAnimeListScreen`.
```kotlin
@HiltViewModel
class TrendingAnimeViewModel @Inject constructor(
private val repository: KitsuRepository
) : ViewModel() {private var _animeData = MutableStateFlow>(emptyList())
val animeData = _animeData.asStateFlow()init {
viewModelScope.launch {
_animeData.update { repository.getTrendingAnime() }
}
}
}
````NavGraph SetUp`
```koltin
@OptIn(ExperimentalSharedTransitionApi::class)
@Composable
fun NavGraph(
startDestination: Screens
) {
val navController = rememberNavController()SharedTransitionLayout {
NavHost(
navController = navController,
startDestination = startDestination
) {
navigation(
startDestination = Screens.OnboardingScreen
){
composable{
// Initializing the view model :->
val viewModel = hiltViewModel()// Calling Onboarding Screen :->
OnboardingScreen(
event = viewModel::onEvent
)
}
}navigation(
startDestination = Screens.HomeScreen
) {
composable {
TrendingAnimeListScreen(
onAnimeClick = { coverImage, id ->
navController.navigate(
Screens.AnimeScreen(id.toString(), coverImage.toString())
)
},
animatedVisibilityScope = this
)
}composable {
val args = it.toRoute()AnimeScreen(
id = args.id.toInt(),
coverImage = args.coverImage,
animatedVisibilityScope = this
)
}
}
}
}
}
```## Contributing
Contributions are welcome! Please fork the repository and submit a pull request for any improvements or bug fixes.
1. Fork the repository.
2. Create your feature branch (`git checkout -b feature/your-feature`).
3. Commit your changes (`git commit -am 'Add some feature'`).
4. Push to the branch (`git push origin feature/your-feature`).
5. Create a new Pull Request.## Contact
For questions or feedback, please contact [@Bhavyansh03-tech](https://github.com/Bhavyansh03-tech) on GitHub or connect with me on [LinkedIn](https://www.linkedin.com/in/bhavyansh03/).
---