gsy_github_app_flutter:基于 Flutter 的跨平台 Github 客户端项目

Chinese Readme

A cross-platform open source Github client App, offering richer features and better experience. Designed for better daily management and maintenance of your personal Github account, providing a more convenient driving experience～～Σ(￣。￣ﾉ)ﾉ. The project involves various common widgets, networking, databases, design patterns, theme switching, multi-language support, state management (Redux, Riverpod, Provider), and more. During the development and learning process, it provides rich comparisons with equivalent implementations:

• Same Weex version ( https://github.com/CarGuo/GSYGithubAppWeex )

• Same ReactNative version ( https://github.com/CarGuo/GSYGithubApp )

• Same Android Kotlin View version ( https://github.com/CarGuo/GSYGithubAppKotlin )

• Same Android Compose version ( https://github.com/CarGuo/GSYGithubAppCompose )

• Same Compose Multiplatform version ( https://github.com/CarGuo/GSYGithubAppCMP )

• Simple Flutter standalone learning project ( https://github.com/CarGuo/gsy_flutter_demo )

Related Articles

• Flutter Series Articles Column

---

• Flutter Simple Learning Demo Project

• Flutter Complete Development Practical Detailed Gitbook Preview Download

• For all running issues please click here

• GSY's old book: 《Flutter Development in Action》 is available: JD.com / Dangdang / E-book JD Reading and Kindle

• If cloning is too slow or if images don't display, you can try downloading from the Gitee address

---

Important Notes

Since this is primarily a learning and demonstration project, it includes various patterns, libraries, UIs, etc. Please don't mind the diversity

0. Global state management currently has multiple modes, including Provider, Redux, Riverpod, etc.

1. TrendPage: Currently uses pure riverpod state management for demonstration

2. Provider: Currently used in RepositoryDetailPage

3. Redux: Currently demonstrated for global login and user information.

4. riverpod: Currently used to manage global grayscale and multi-language.

5. Repos and other requests demonstrate graphQL

6. Redux: Currently demonstrated for global login and user information.

7. Signals: Currently used for in-page state management in NotifyPage, RepositoryDetailFileListPage

There are multiple list displays, including:

1. gsy_pull_load_widget.dart.dart Used in common_list_page.dart, etc., paired with gsy_list_state.dart

2. gsy_pull_new_load_widget.dart.dart Used in dynamic_page.dart, etc., paired with gsy_bloc_list_state.dart Supports both iOS and Android pull-to-refresh styles

3. gsy_nested_pull_load_widget.dart Used in trend_page.dart, etc., configured with sliver effect

Compilation and Running Process

1. Set up the Flutter development environment (current Flutter SDK version 3.47.2, the repo pins this version via .fvmrc, FVM is recommended: fvm install 3.47.2 && fvm use 3.47.2), see Setting up the environment.

2. Clone the code, run Packages get to install third-party packages. (Due to certain reasons beyond control, you may need to set up a proxy in China: Proxy environment variables)

3. Important: You need to create an ignoreConfig.dart file in the lib/common/config/ directory yourself, and then enter your registered Github client_id and client_secret.

 class NetConfig {
   static const CLIENT_ID = "xxxx";
 
   static const CLIENT_SECRET = "xxxxxxxxxxx";
 }

Register Github APP link, of course, the prerequisite is that you already have a github account (～￣▽￣)～.

4. If using secure login (authorization login), then in the above Github App registration, the Authorization callback URL field must be filled with gsygithubapp://authed

5. Please note before running

1. Local Flutter SDK version 3.47.2 (pinned in .fvmrc, use fvm use to switch); 2. Have you executed flutter pub get; 3. For network and other issues, refer to: If login fails or requests fail

Download

APK download link: APK download link 1

APK download link: APK download link 2

Type	QR Code
APK QR Code
iOS download not available

Project Structure Diagram

Common Issues

• If package synchronization fails, it's usually because the package proxy is not set. You can refer to: Environment variable issues

• If cloning is too slow, you can try downloading from the Gitee address

Example Images

Framework

Current Flutter SDK version 3.47.2

User Interaction → UI Layer(Widget/Page) → State Layer(Redux/Provider/Riverpod) → Service Layer(Repositories) 
       → Network Layer(Net) → GitHub API → Data Model(Model) → Local Storage(DB) → UI Update

┌─────────────────────────────────────────────────────────────────┐
│                         GSY GitHub App                          │
├─────────────┬───────────────┬────────────────┬─────────────────┤
│   UI Layer  │  State Layer  │  Service Layer │     Data Layer  │
├─────────────┼───────────────┼────────────────┼─────────────────┤
│             │               │                │                 │
│  ┌─────────┐│  ┌─────────┐  │  ┌─────────┐   │   ┌─────────┐   │
│  │ Pages   ││  │ Redux   │  │  │Repositories│  │   │ Models │   │
│  └─────────┘│  └─────────┘  │  └─────────┘   │   └─────────┘   │
│             │               │                │                 │
│  ┌─────────┐│  ┌─────────┐  │  ┌─────────┐   │   ┌─────────┐   │
│  │ Widgets ││  │ Provider│  │  │Network API│  │   │Database │   │
│  └─────────┘│  └─────────┘  │  └─────────┘   │   └─────────┘   │
│             │               │                │                 │
│  ┌─────────┐│  ┌─────────┐  │                │                 │
│  │Common UI││  │Riverpod │  │                │                 │
│  └─────────┘│  └─────────┘  │                │                 │
│             │               │                │                 │
│             │  ┌─────────┐  │                │                 │
│             │  │ Signals │  │                │                 │
│             │  └─────────┘  │                │                 │
│             │               │                │                 │
└─────────────┴───────────────┴────────────────┴─────────────────┘

lib/
├── main.dart              # Application entry point
├── main_prod.dart         # Production environment entry point
├── app.dart               # Application configuration and routing
├── common/                # Common functionality modules
│   ├── config/            # Application configuration
│   ├── event/             # Event bus
│   ├── local/             # Localization
│   ├── localization/      # Multi-language support
│   ├── net/               # Network requests
│   ├── repositories/      # Data repositories
│   ├── router/            # Routing configuration
│   ├── style/             # Style configuration
│   └── utils/             # Utility classes
├── db/                    # Database related
│   ├── provider/          # Database providers
│   ├── sql_manager.dart   # SQL manager
│   └── sql_provider.dart  # SQL provider
├── env/                   # Environment configuration
├── model/                 # Data models
├── page/                  # Pages
│   ├── debug/             # Debug pages
│   ├── dynamic/           # Dynamic pages
│   ├── home/              # Home page
│   ├── issue/             # Issue related pages
│   ├── login/             # Login page
│   ├── push/              # Push related pages
│   ├── release/           # Release related pages
│   ├── repos/             # Repository related pages
│   ├── search/            # Search page
│   ├── trend/             # Trend page
│   └── user/              # User related pages
├── provider/              # Provider state management
├── redux/                 # Redux state management
│   ├── middleware/        # Redux middleware
│   ├── gsy_state.dart     # Redux state definition
│   ├── login_redux.dart   # Login state management
│   └── user_redux.dart    # User state management
├── test/                  # Test related
└── widget/                # Custom widgets
    ├── anima/             # Animation widgets
    ├── markdown/          # Markdown rendering widgets
    ├── menu/              # Menu widgets
    ├── particle/          # Particle effect widgets
    ├── pull/              # Pull-to-refresh widgets
    └── state/             # State related widgets

Riverpod page state management:

┌───────────────────────────────────────────────────────────────────────────┐
│                         Page Architecture Overview                         │
└───────────────────────────────────────────────────────────────────────────┘
                                      │
                                      ▼
┌───────────────────────────────────────────────────────────────────────────┐
│                              Global State                                  │
│  ┌───────────────────┐   ┌────────────────────┐   ┌────────────────────┐  │
│  │ appThemeProvider  │   │ appLocalProvider   │   │ appGrepProvider    │  │
│  │ (Theme Data)      │   │ (Localization)     │   │ (Grayscale Mode)   │  │
│  └───────────────────┘   └────────────────────┘   └────────────────────┘  │
└───────────────────────────────────────────────────────────────────────────┘
                                      │
                     ┌────────────────┴────────────────┐
                     ▼                                 ▼
┌─────────────────────────────────┐  ┌─────────────────────────────────────┐
│     TrendPage (Riverpod)        │  │       NotifyPage (Signals)          │
├─────────────────────────────────┤  ├─────────────────────────────────────┤
│                                 │  │                                     │
│┌─────────────────────────────┐  │  │┌───────────────────────────────────┐│
││      Riverpod Providers     │  │  ││         Signals State             ││
││┌───────────────────────────┐│  │  ││┌─────────────────────────────────┐││
│││    trendFirstProvider     ││  │  │││   notifySignal (List)           │││
│││    trendSecondProvider    ││  │  │││   notifyIndexSignal (int)       │││
││└───────────────────────────┘│  │  │││   signalPage (int)              │││
│└─────────────────────────────┘  │  ││└─────────────────────────────────┘││
│                                 │  │└───────────────────────────────────┘│
│┌─────────────────────────────┐  │  │┌───────────────────────────────────┐│
││  Local State (StatefulWidget)│  │  ││     SignalsMixin Processing      ││
││  - UI Controls              │  │  ││  - createEffect() for reactions   ││
││  - Filter Parameters        │  │  ││  - Manages data loading           ││
│└─────────────────────────────┘  │  ││  - Updates UI based on signals    ││
│                                 │  │└───────────────────────────────────┘│
└─────────────────────────────────┘  └─────────────────────────────────────┘
                     │                                 │
                     └────────────────┬────────────────┘
                                      ▼
┌───────────────────────────────────────────────────────────────────────────┐
│                            Data Layer                                      │
│  ┌───────────────────────────────────────────────────────────────────────┐ │
│  │                  ReposRepository / UserRepository                     │ │
│  │  ┌────────────────────────┐       ┌─────────────────────────────────┐ │ │
│  │  │ Network Request        │───┬──▶│ Database Providers              │ │ │
│  │  │ - API calls            │   │   │ - Data caching                  │ │ │
│  │  └────────────────────────┘   │   └─────────────────────────────────┘ │ │
│  │                               │                                       │ │
│  │                               │   ┌─────────────────────────────────┐ │ │
│  │                               └──▶│ Data Models                     │ │ │
│  │                                   │ - Structure definitions         │ │ │
│  │                                   └─────────────────────────────────┘ │ │
│  └───────────────────────────────────────────────────────────────────────┘ │
└───────────────────────────────────────────────────────────────────────────┘
                                      │
                                      ▼
┌───────────────────────────────────────────────────────────────────────────┐
│                              UI Components                                 │
│  ┌────────────────────┐  ┌────────────────────┐  ┌────────────────────┐   │
│  │ View Models        │  │ List Items         │  │ Interactive UI     │   │
│  │ - Data Formatting  │  │ - Item Rendering   │  │ - User Actions     │   │
│  └────────────────────┘  └────────────────────┘  └────────────────────┘   │
└───────────────────────────────────────────────────────────────────────────┘

Provider page state management:

+-----------------------------------------------------+
|                   App User Interface                 |
+-----------------------------------------------------+
                          |
                          v
+-----------------------------------------------------+
|              RepositoryDetailPage (StatefulWidget)  |
|            with SingleTickerProviderStateMixin      |
+-----------------------------------------------------+
                          |
                          v
+-----------------------------------------------------+
|                   MultiProvider                      |
+-----------------------------------------------------+
        |                                 |
        v                                 v
+------------------+           +-----------------------+
| ReposNetWork     |<----------|  ReposDetailProvider  |
| Provider         |           |                       |
+---------+--------+           +-----------------------+
          |                                |
          |                                |
          v                                v
+-----------------------------------------------------+
|              Repository Data Services               |
| (ReposRepository, IssueRepository)                  |
+-----------------------------------------------------+
          |
          v
+-----------------------------------------------------+
|                Four Tab Pages (Consumers)           |
+-----------------------------------------------------+
    |           |           |           |
    v           v           v           v
+----------+ +----------+ +----------+ +----------+
| Info     | | Readme   | | Issues   | | Files    |
| Page     | | Page     | | Page     | | Page     |
+----------+ +----------+ +----------+ +----------+
    |           |           |           |
    |           |           |           |
    v           v           v           v
+-----------------------------------------------------+
|                GlobalKeys for Tab Access             |
| (infoListKey, readmeKey, issueListKey, fileListKey) |
+-----------------------------------------------------+

Star History Chart

LICENSE

CarGuo/GSYGithubAppFlutter is licensed under the
Apache License 2.0

A permissive license whose main conditions require preservation of copyright and license notices. 
Contributors provide an express grant of patent rights. 
Licensed works, modifications, and larger works may be distributed under different terms and without source code.

​