使用Flutter開發的一款仿Gitme的客戶端
前言
離上篇文章介紹OpenGit_Flutter已通過了兩個月，在兩個月期間完成了v1.1.0、v1.2.0以及下文立刻介紹的v1.3.0版本，點擊見版本更新記錄。在v1.3.0版本中，對總體UI作了修改，採用卡片式風格；對登陸界面作了改版，UI主要參考flutter-ui-nice；優化了編輯issue、評論相關邏輯，並增長標籤功能；改版了我的資料頁面，並增長組織相關邏輯，UI主要參考flutter-ui-nice；增長了分享功能等。v1.3.0版本相比較之前的版本，體驗上作了較大的改動，下面一一介紹該客戶端涉及到的相關內容。javascript
該項目涉及到的主要架構，能夠參考MVC、MVP、BloC、Redux四種架構在Flutter上的嘗試。html
項目中卡片式風格的主要代碼以下所示java
InkWell(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: _postCard(context, item),
),
onTap: () {
NavigatorUtil.goWebView(context, item.title, item.originalUrl);
},
)
Widget _postCard(BuildContext context) {
return Card(
elevation: 2.0,
child: ......
);
}
複製代碼
程序入口
void main() {
final store = Store<AppState>(
appReducer,
initialState: AppState.initial(),
middleware: [
LoginMiddleware(),
UserMiddleware(),
AboutMiddleware(),
],
);
runZoned(() {
runApp(OpenGitApp(store));
}, onError: (Object obj, StackTrace trace) {
print(obj);
print(trace);
});
}
複製代碼
程序入口main方法內，進行了redux相關初始化操做，並啓動了OpenGitApp頁面。而runZoned是爲了在運行環境內捕獲全局異常等信息，便於分析問題。node
下面看下OpenGitApp頁面的相關代碼，具體代碼以下所示react
class OpenGitApp extends StatefulWidget {
final Store<AppState> store;
OpenGitApp(this.store) {
final router = Router();
AppRoutes.configureRoutes(router);
Application.router = router;
}
@override
State<StatefulWidget> createState() {
return _OpenGitAppState();
}
}
複製代碼
在OpenGitApp構造函數內，完成了Fluro路由的相關初始化操做，關於Fluro後續會補充文章介紹。而閃屏頁的定義以下面代碼所示git
static final splash = '/';
router.define(
splash,
handler: splashHandler,
transitionType: TransitionType.cupertino,
);
var splashHandler = Handler(
handlerFunc: (BuildContext context, Map<String, List<String>> params) {
return SplashPage();
});
複製代碼
當OpenGitApp相關頁面初始化功能加載完成後，默認會啓動SplashPage頁面，同時_OpenGitAppState類中，會進行相關數據的初始化功能，以下面代碼所示github
class _OpenGitAppState extends State<OpenGitApp> {
static final String TAG = "OpenGitApp";
@override
void initState() {
super.initState();
widget.store.dispatch(InitAction());
}
}
複製代碼
在initState中發起redux初始化數據指令InitAction，當指令發出後，UserMiddleware會收到該指令，並對該指令作相應的處理，以下面代碼所示web
Future<Null> _init(Store<AppState> store, NextDispatcher next) async {
//完成sp的初始化
await SpUtil.instance.init();
//初始化數據庫，並進行刪除操做
CacheProvider provider = CacheProvider();
await provider.delete();
//主題
int theme = SpUtil.instance.getInt(SP_KEY_THEME_COLOR);
if (theme != 0) {
Color color = Color(theme);
next(RefreshThemeDataAction(AppTheme.changeTheme(color)));
}
//語言
int locale = SpUtil.instance.getInt(SP_KEY_LANGUAGE_COLOR);
if (locale != 0) {
next(RefreshLocalAction(LocaleUtil.changeLocale(store.state, locale)));
}
//用戶信息
String token = SpUtil.instance.getString(SP_KEY_TOKEN);
UserBean userBean = null;
var user = SpUtil.instance.getObject(SP_KEY_USER_INFO);
if (user != null) {
LoginManager.instance.setUserBean(user, false);
userBean = UserBean.fromJson(user);
}
LoginManager.instance.setToken(token, false);
//引導頁
String version =
SpUtil.instance.getString(SP_KEY_SHOW_GUIDE_VERSION);
String currentVersion = Config.SHOW_GUIDE_VERSION;
next(InitCompleteAction(token, userBean, currentVersion != version));
//初始化本地數據
ReposManager.instance.initLanguageColors();
}
複製代碼
閃屏頁
當進入到閃屏頁後，經過redux啓動頁面的倒計時操做，以下面代碼所示數據庫
store.dispatch(StartCountdownAction(context));
複製代碼
當發出倒計時指令後，UserMiddleware會收到該指令，並對該指令作相應的處理，以下面代碼所示redux
void startCountdown(
Store<AppState> store, NextDispatcher next, BuildContext context) {
TimerUtil.startCountdown(5, (int count) {
next(CountdownAction(count));
if (count == 0) {
_jump(context, store.state.userState.status,
store.state.userState.isGuide);
}
});
}
複製代碼
經過TimerUtil啓動一個5s的倒計時，並將倒計時的時間點同步給SplashPage頁面，用來刷新倒計時時間，TimerUtil工具類不作過多介紹，細節能夠參考OpenGit_Flutter項目經常使用公共庫總結。當倒計時跑完以後，會經過用戶初始化數據狀態，進行頁面跳轉操做，以下面代碼所示
void _jump(BuildContext context, LoginStatus status, bool isShowGuide) {
if (isShowGuide) {
NavigatorUtil.goGuide(context);
} else if (status == LoginStatus.success) {
NavigatorUtil.goMain(context);
} else if (status == LoginStatus.error) {
NavigatorUtil.goLogin(context);
}
}
複製代碼
當用戶是首次操做應用時，則跳轉到引導頁；若是已登陸，則跳轉主頁，若是未登陸；則跳轉登陸頁。
引導頁
引導頁相關代碼參考flutter_gallery裏的animation，這裏不作過大介紹。當點擊當即體驗時，相關代碼以下所示
void _onExperience(BuildContext context) {
Store<AppState> store = StoreProvider.of(context);
LoginStatus status = store.state.userState.status;
if (status == LoginStatus.success) {
NavigatorUtil.goMain(context);
} else if (status == LoginStatus.error) {
NavigatorUtil.goLogin(context);
}
}
複製代碼
首先經過redux查詢用戶的登陸狀態，若是已登陸，則跳轉主頁，若是未登陸；則跳轉登陸頁。
登陸頁
登陸過程分爲受權和獲取用戶資料，涉及到的api以下所示
- 受權api
POST /authorizations
- 獲取用戶資料api
GET /user
當用戶沒有帳號時，能夠進行帳號的註冊，以下面代碼所示
NavigatorUtil.goWebView(
context,
AppLocalizations.of(context).currentlocal.sign_up,
'https://github.com/');
複製代碼
當用戶存在帳號，完成帳號和密碼的輸入，點擊登陸，以下面代碼所示
store.dispatch(FetchLoginAction(context, name, password));
複製代碼
當LoginMiddleware收到該指令，觸發登陸，以下面代碼所示
Future<void> _doLogin(NextDispatcher next, BuildContext context,
String userName, String password) async {
next(RequestingLoginAction());
try {
LoginBean loginBean =
await LoginManager.instance.login(userName, password);
if (loginBean != null) {
String token = loginBean.token;
LoginManager.instance.setToken(loginBean.token, true);
UserBean userBean = await LoginManager.instance.getMyUserInfo();
if (userBean != null) {
next(InitCompleteAction(token, userBean, false));
next(ReceivedLoginAction(token, userBean));
NavigatorUtil.goMain(context);
} else {
ToastUtil.showMessgae('登陸失敗請從新登陸');
LoginManager.instance.setToken(null, true);
}
} else {
ToastUtil.showMessgae('登陸失敗請從新登陸');
next(ErrorLoadingLoginAction());
}
} catch (e) {
LogUtil.v(e, tag: TAG);
ToastUtil.showMessgae('登陸失敗請從新登陸');
next(ErrorLoadingLoginAction());
}
}
複製代碼
當開始登陸時，redux發出指令RequestingLoginAction加載loading界面，當登陸成功後，會對token信息進行緩存，而後在獲取用戶資料，當用戶資料獲取成功後，則判斷登陸成功，跳轉到主頁面。
主頁
主頁的頁面加載是採用TabBar+PageView(TabBarView慎用)組合加載home、repo、event、issue四個頁面，關鍵代碼以下所示
TabBar(
controller: _tabController,
labelPadding: EdgeInsets.all(8.0),
indicatorColor: Colors.white,
tabs: choices.map((Choice choice) {
return Tab(
text: choice.title,
);
}).toList(),
onTap: (index) {
_pageController.jumpTo(ScreenUtil.getScreenWidth(context) * index);
},
)
//慎用TabBarView，假如如今有四個tab，若是首次進入app以後，
//點擊issue tab，動態 tab也會觸發加載數據，而且當即銷燬
PageView(
controller: _pageController,
physics: NeverScrollableScrollPhysics(),
children: <Widget>[
BlocProvider<HomeBloc>(
child: HomePage(),
bloc: _homeBloc,
),
BlocProvider<ReposBloc>(
child: ReposPage(PageType.repos),
bloc: _reposBloc,
),
BlocProvider<EventBloc>(
child: EventPage(PageType.received_event),
bloc: _eventBloc,
),
BlocProvider<IssueBloc>(
child: IssuePage(),
bloc: _issueBloc,
),
],
onPageChanged: (index) {
_tabController.animateTo(index);
},
)
複製代碼
首頁
首頁展現的數據是獲取掘金flutter列表，相關api以下所示
GET timeline-merger-ms.juejin.im/v1/get_tag_… 'src=web&tagId=5a96291f6fb9a0535b535438&page=$page&pageSize=20&sort=rankIndex
涉及到的相關代碼以下所示
Future _fetchHomeList() async {
LogUtil.v('_fetchHomeList', tag: TAG);
try {
var result = await JueJinManager.instance.getJueJinList(page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
點擊item，跳轉到相應的h5頁面，以下面代碼所示
NavigatorUtil.goWebView(context, item.title, item.originalUrl)
複製代碼
項目頁
項目頁展現的數據是本身已公開的項目列表，相關api以下所示
GET /users/:username/repos
涉及到的相關代碼以下所示
///repo_bloc.dart
Future _fetchReposList() async {
LogUtil.v('_fetchReposList', tag: TAG);
try {
var result = await fetchRepos(page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
///repo_main_bloc.dart
@override
fetchRepos(int page) async {
return await ReposManager.instance
.getUserRepos(userName, page, null, false);
}
複製代碼
上面代碼對請求項目相關接口進行下封裝，主要邏輯在repo_bloc.dart中已經進行了處理，子類只需實現fetchRepos方法便可。
點擊item，跳轉至項目詳情頁，以下面代碼所示
NavigatorUtil.goReposDetail(context, item.owner.login, item.name);
複製代碼
動態頁
動態頁展現的數據是已收到的動態列表，相關api以下所示
GET /users/:username/received_events
涉及到的相關代碼以下所示
///event_bloc.dart
Future _fetchEventList() async {
LogUtil.v('_fetchEventList', tag: TAG);
try {
var result = await fetchEvent(page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
///received_event_Bloc
@override
fetchEvent(int page) async {
return await EventManager.instance.getEventReceived(userName, page);
}
複製代碼
點擊item，會區分不一樣事件，若是和issue相關事件，則跳轉問題詳情頁，若是和項目相關事件，則跳轉項目詳情頁，以下面代碼所示
if (item.payload != null && item.payload.issue != null) {
NavigatorUtil.goIssueDetail(context, item.payload.issue);
} else if (item.repo != null && item.repo.name != null) {
String repoUser, repoName;
if (item.repo.name.isNotEmpty && item.repo.name.contains("/")) {
List<String> repos = TextUtil.split(item.repo.name, '/');
repoUser = repos[0];
repoName = repos[1];
}
NavigatorUtil.goReposDetail(context, repoUser, repoName);
}
複製代碼
問題頁
問題頁展現的數據是已收到的問題列表，相關api以下所示
GET /issues?filter=:filter&state=:state&sort=:sort&direction=:direction
涉及到的相關代碼以下所示
Future _fetchIssueList() async {
LogUtil.v('_fetchIssueList', tag: TAG);
try {
var result = await IssueManager.instance
.getIssue(filter, state, sort, direction, page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
點擊item，跳轉至問題詳情頁，以下面代碼所示
NavigatorUtil.goIssueDetail(context, item);
複製代碼
項目詳情頁
首次進入項目詳情頁時，會查詢該項目的詳情以及star和watch狀態，相關api以下所示
- 項目詳情
GET /repos/:owner/:repo
- star狀態
GET /user/starred/:owner/:repo
- watch狀態
GET /user/subscriptions/:owner/:repo
涉及到的相關代碼以下所示
Future _fetchReposDetail() async {
final repos =
await ReposManager.instance.getReposDetail(reposOwner, reposName);
bean.data.repos = repos;
if (repos == null) {
bean.isError = true;
} else {
bean.isError = false;
}
sink.add(bean);
_fetchStarStatus();
_fetchWatchStatus();
}
Future _fetchStarStatus() async {
final response =
await ReposManager.instance.getReposStar(reposOwner, reposName);
bean.data.starStatus =
response.result ? ReposStatus.active : ReposStatus.inactive;
sink.add(bean);
}
Future _fetchWatchStatus() async {
final response =
await ReposManager.instance.getReposWatcher(reposOwner, reposName);
bean.data.watchStatus =
response.result ? ReposStatus.active : ReposStatus.inactive;
sink.add(bean);
}
複製代碼
改變star和watch狀態，相關api以下 添加
- star狀態
PUT /user/starred/:owner/:repo
- watch狀態
PUT /user/subscriptions/:owner/:repo
刪除
- star狀態
DELETE /user/starred/:owner/:repo
- watch狀態
DELETE /user/subscriptions/:owner/:repo
涉及到的相關代碼以下所示
void changeStarStatus() async {
bool isEnable = bean.data.starStatus == ReposStatus.active;
bean.data.starStatus = ReposStatus.loading;
sink.add(bean);
final response = await ReposManager.instance
.doReposStarAction(reposOwner, reposName, isEnable);
if (response.result) {
if (isEnable) {
bean.data.starStatus = ReposStatus.inactive;
} else {
bean.data.starStatus = ReposStatus.active;
}
}
sink.add(bean);
}
void changeWatchStatus() async {
bool isEnable = bean.data.watchStatus == ReposStatus.active;
bean.data.watchStatus = ReposStatus.loading;
sink.add(bean);
final response = await ReposManager.instance
.doReposWatcherAction(reposOwner, reposName, isEnable);
if (response.result) {
if (isEnable) {
bean.data.watchStatus = ReposStatus.inactive;
} else {
bean.data.watchStatus = ReposStatus.active;
}
}
sink.add(bean);
}
複製代碼
上述代碼若是isEnable狀態爲true，則請求DELETE，反之是PUT
項目stars用戶列表
相關api以下所示
GET /repos/:owner/:repo/stargazers
涉及到的相關代碼以下所示
///user_bloc.dart
Future _fetchUserList() async {
LogUtil.v('_fetchUserList', tag: TAG);
try {
var result = await fetchList(page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
///stargazer_bloc.dart
@override
fetchList(int page) async {
return await UserManager.instance.getStargazers(url, page);
}
複製代碼
上面代碼對請求用戶相關接口進行下封裝，主要邏輯在user_bloc.dart中已經進行了處理，子類stargazer_bloc繼承了user_bloc，只需實現fetchList方法便可
項目issues列表
相關api以下所示
GET repos/:owner/:repo/issues
涉及到的相關代碼以下所示
Future _fetchIssueList() async {
LogUtil.v('_fetchIssueList', tag: TAG);
try {
var result = await IssueManager.instance.getRepoIssues(owner, repo, page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
項目forks用戶列表
相關api以下所示
GET repos/:owner/:repo/forks
涉及到的相關代碼以下所示
@override
fetchList(int page) async {
return await ReposManager.instance.getRepoForks(owner, repo, page);
}
複製代碼
因爲repo_fork_bloc繼承user_bloc因此只需實現fetchList便可，具體細節能夠在上文查看
項目watchers用列表
相關api以下所示
GET repos/:owner/:repo/subscribers
涉及到的相關代碼以下所示
@override
fetchList(int page) async {
return await UserManager.instance.getSubscribers(url, page);
}
複製代碼
因爲subscriber_bloc繼承user_bloc因此只需實現fetchList便可，具體細節能夠在上文查看
項目語言趨勢列表
相關api以下所示
GET search/repositories?q=language:$language&sort=stars
涉及到的相關代碼以下所示
Future _fetchTrendList() async {
try {
var result = await ReposManager.instance.getLanguages(language, page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
項目動態列表
相關api以下所示
GET networks/:owner/:repo/events
涉及到的相關代碼以下所示
Future _fetchEventList() async {
try {
var result = await ReposManager.instance
.getReposEvents(reposOwner, reposName, page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
項目貢獻者用戶列表
相關api以下所示
GET repos/:owner/:repo/contributors
涉及到的相關代碼以下所示
@override
fetchList(int page) async {
return await UserManager.instance.getContributors(url, page);
}
複製代碼
因爲contributor_bloc繼承user_bloc因此只需實現fetchList便可，具體細節能夠在上文查看
項目分支列表
相關api以下所示
GET repos/
涉及到的相關代碼以下所示
void fetchBranches() async {
final response =
await ReposManager.instance.getBranches(reposOwner, reposName);
bean.data.branchs = response;
sink.add(bean);
}
複製代碼
項目詳情列表
相關api以下所示
GET repos/:owner/:repo/contents:path
涉及到的相關代碼以下所示
Future _fetchSourceFile() async {
String path = _getPath();
final result = await ReposManager.instance
.getReposFileDir(reposOwner, reposName, path: path, branch: branch);
if (bean.data == null) {
bean.data = List();
}
bean.data.clear();
if (result != null) {
bean.isError = false;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
}
複製代碼
點擊詳情列表，會區分文件夾、圖片、文件詳情三種三種場景，以下面代碼所示
void _onItemClick(BuildContext context, SourceFileBean item) {
bool isImage = ImageUtil.isImage(item.name);
if (item.type == "dir") {
RepoFileBloc bloc = BlocProvider.of<RepoFileBloc>(context);
bloc.fetchNextDir(item.name);
} else if (isImage) {
NavigatorUtil.goPhotoView(context, item.name, item.htmlUrl + "?raw=true");
} else {
NavigatorUtil.goReposSourceCode(context, item.name,
ImageUtil.isImage(item.url) ? item.downloadUrl : item.url);
}
}
複製代碼
若是是文件夾狀態則刷新該目錄文件列表；若是是圖片狀態則調用圖片加載頁面，詳見OpenGit_Flutter項目經常使用公共庫總結；若是是詳情狀態則跳轉詳情頁進行處理，具體以下所示
項目詳情頁
涉及到的相關代碼以下所示
getCodeDetail(url) async {
final response =
await _getFileAsStream(url, {"Accept": 'application/vnd.github.html'});
String data = CodeDetailUtil.resolveHtmlFile(response, "java");
String result = Uri.dataFromString(data,
mimeType: 'text/html', encoding: Encoding.getByName("utf-8"))
.toString();
return result;
}
Widget build(BuildContext context) {
if (data == null) {
return Scaffold(
appBar:CommonUtil.getAppBar(widget.title),
body: Container(
alignment: Alignment.center,
child: Center(
child: SpinKitCircle(
color: Theme.of(context).primaryColor,
size: 25.0,
),
),
),
);
}
return Scaffold(
appBar: CommonUtil.getAppBar(widget.title),
body: WebView(
initialUrl: data,
javascriptMode: JavascriptMode.unrestricted,
),
);
}
複製代碼
項目README
相關api以下所示
GET repos/:owner/:repo/readme
涉及到的相關代碼以下所示
void fetchReadme() async {
final response =
await ReposManager.instance.getReadme("$reposOwner/$reposName", null);
bean.data.readme = response.data;
sink.add(bean);
}
複製代碼
瀏覽器打開
涉及到的相關代碼以下所示
@override
void openWebView(BuildContext context) {
RepoDetailBloc bloc = BlocProvider.of<RepoDetailBloc>(context);
NavigatorUtil.goWebView(
context, bloc.reposName, bloc.bean.data.repos.htmlUrl);
}
複製代碼
分享
涉及到的相關代碼以下所示
void _share(BuildContext context) {
ShareUtil.share(getShareText(context));
}
@override
String getShareText(BuildContext context) {
RepoDetailBloc bloc = BlocProvider.of<RepoDetailBloc>(context);
return bloc.bean.data.repos.htmlUrl;
}
複製代碼
問題詳情頁
首次進入問題詳情頁時，會查詢該問題的詳情以及評論列表，相關api以下所示
- 問題詳情
GET /repos/:owner/:repo/issues/:issue_number
- 評論列表
GET /repos/:owner/:repo/issues/:issue_number/comments
涉及到的相關代碼以下所示
void _fetchIssueComment() async {
IssueBean result =
await IssueManager.instance.getSingleIssue(url, num);
bean.data.issueBean = result;
}
Future _fetchIssueComments() async {
try {
var result = await IssueManager.instance
.getIssueComment(url, num, page);
if (bean.data == null) {
bean.data.comments = List();
}
if (page == 1) {
bean.data.comments.clear();
}
noMore = true;
if (result != null) {
noMore = result.length != Config.PAGE_SIZE;
bean.data.comments.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
添加評論
相關api以下所示
POST /repos/:owner/:repo/issues/:issue_number/comments
涉及到的相關代碼以下所示
_editIssueComment() async {
IssueBean result = null;
_showLoading();
if (!widget.isAdd) {
result = await IssueManager.instance.editIssueComment(
widget.repoUrl, widget.id, _controller.text.toString());
} else {
result = await IssueManager.instance.addIssueComment(
widget.repoUrl, widget.id, _controller.text.toString());
}
_hideLoading();
if (result != null) {
Navigator.pop(context, result);
}
}
複製代碼
添加評論時widget.isAdd = true
編輯評論
相關api以下所示
PATCH /repos/:owner/:repo/issues/:issue_number/comments
涉及到的相關代碼以下所示
_editIssueComment() async {
IssueBean result = null;
_showLoading();
if (!widget.isAdd) {
result = await IssueManager.instance.editIssueComment(
widget.repoUrl, widget.id, _controller.text.toString());
} else {
result = await IssueManager.instance.addIssueComment(
widget.repoUrl, widget.id, _controller.text.toString());
}
_hideLoading();
if (result != null) {
Navigator.pop(context, result);
}
}
複製代碼
編輯評論時widget.isAdd = false
刪除評論
相關api以下所示
DELETE /repos/:owner/:repo/issues/:issue_number/comments
涉及到的相關代碼以下所示
void deleteIssueComment(IssueBean item) async {
showLoading();
int comment_id = item.id;
final response =
await IssueManager.instance.deleteIssueComment(url, comment_id);
if (response != null && response.result) {
bean.data.comments.remove(item);
sink.add(bean);
}
hideLoading();
}
複製代碼
編輯問題
相關api以下所示
PATCH /repos/:owner/:repo/issues/:issue_number
涉及到的相關代碼以下所示
_editIssue() async {
_showLoading();
final result = await IssueManager.instance.editIssue(widget.url, widget.num,
_titleController.text.toString(), _bodyController.text.toString());
_hideLoading();
if (result != null) {
Navigator.pop(context, result);
}
}
複製代碼
Reactions
問題Reactions列表
相關api以下所示
GET /repos/:owner/:repo/issues/:issue_number/reactions
涉及到的相關代碼以下所示
_queryIssueCommentReaction(IssueBean item, comment, isIssue) async {
int id;
if (isIssue) {
id = item.number;
} else {
id = item.id;
}
final response = await IssueManager.instance
.getCommentReactions(url, id, comment, 1, isIssue);
ReactionDetailBean findReaction = null;
if (response != null) {
UserBean userBean = LoginManager.instance.getUserBean();
for (int i = 0; i < response.length; i++) {
ReactionDetailBean reactionDetailBean = response[i];
if (reactionDetailBean != null &&
reactionDetailBean.content == comment &&
userBean != null &&
reactionDetailBean.user != null &&
userBean.login == reactionDetailBean.user.login) {
findReaction = reactionDetailBean;
break;
}
}
}
if (findReaction != null) {
return await _deleteIssueCommentReaction(item, findReaction, comment);
} else {
return await _createIssueCommentReaction(item, comment, isIssue);
}
}
複製代碼
添加問題Reaction
相關api以下所示
POST /repos/:owner/:repo/issues/:issue_number/reactions
涉及到的相關代碼以下所示
_createIssueCommentReaction(IssueBean item, comment, isIssue) async {
int id;
if (isIssue) {
id = item.number;
} else {
id = item.id;
}
final response =
await IssueManager.instance.editReactions(url, id, comment, isIssue);
if (response != null && response.result) {
_addIssueBean(item, comment);
sink.add(bean);
}
return response;
}
IssueBean _addIssueBean(IssueBean issueBean, String comment) {
if (issueBean.reaction == null) {
issueBean.reaction = ReactionBean('', 0, 0, 0, 0, 0, 0, 0, 0, 0);
}
if ("+1" == comment) {
issueBean.reaction.like++;
} else if ("-1" == comment) {
issueBean.reaction.noLike++;
} else if ("hooray" == comment) {
issueBean.reaction.hooray++;
} else if ("eyes" == comment) {
issueBean.reaction.eyes++;
} else if ("laugh" == comment) {
issueBean.reaction.laugh++;
} else if ("confused" == comment) {
issueBean.reaction.confused++;
} else if ("rocket" == comment) {
issueBean.reaction.rocket++;
} else if ("heart" == comment) {
issueBean.reaction.heart++;
}
return issueBean;
}
複製代碼
評論Reactions列表
相關api以下所示
GET /repos/:owner/:repo/issues/comments/:comment_id/reactions
涉及到的相關代碼以下所示
_queryIssueCommentReaction(IssueBean item, comment, isIssue) async {
int id;
if (isIssue) {
id = item.number;
} else {
id = item.id;
}
final response = await IssueManager.instance
.getCommentReactions(url, id, comment, 1, isIssue);
ReactionDetailBean findReaction = null;
if (response != null) {
UserBean userBean = LoginManager.instance.getUserBean();
for (int i = 0; i < response.length; i++) {
ReactionDetailBean reactionDetailBean = response[i];
if (reactionDetailBean != null &&
reactionDetailBean.content == comment &&
userBean != null &&
reactionDetailBean.user != null &&
userBean.login == reactionDetailBean.user.login) {
findReaction = reactionDetailBean;
break;
}
}
}
if (findReaction != null) {
return await _deleteIssueCommentReaction(item, findReaction, comment);
} else {
return await _createIssueCommentReaction(item, comment, isIssue);
}
}
複製代碼
添加評論Reaction
相關api以下所示
POST /repos/:owner/:repo/issues/comments/:comment_id/reactions
涉及到的相關代碼以下所示
_createIssueCommentReaction(IssueBean item, comment, isIssue) async {
int id;
if (isIssue) {
id = item.number;
} else {
id = item.id;
}
final response =
await IssueManager.instance.editReactions(url, id, comment, isIssue);
if (response != null && response.result) {
_addIssueBean(item, comment);
sink.add(bean);
}
return response;
}
IssueBean _addIssueBean(IssueBean issueBean, String comment) {
if (issueBean.reaction == null) {
issueBean.reaction = ReactionBean('', 0, 0, 0, 0, 0, 0, 0, 0, 0);
}
if ("+1" == comment) {
issueBean.reaction.like++;
} else if ("-1" == comment) {
issueBean.reaction.noLike++;
} else if ("hooray" == comment) {
issueBean.reaction.hooray++;
} else if ("eyes" == comment) {
issueBean.reaction.eyes++;
} else if ("laugh" == comment) {
issueBean.reaction.laugh++;
} else if ("confused" == comment) {
issueBean.reaction.confused++;
} else if ("rocket" == comment) {
issueBean.reaction.rocket++;
} else if ("heart" == comment) {
issueBean.reaction.heart++;
}
return issueBean;
}
複製代碼
刪除Reaction
相關api以下所示
DELETE /reactions/:reaction_id
涉及到的相關代碼以下所示
_deleteIssueCommentReaction(
IssueBean issueBean, ReactionDetailBean item, content) async {
final response = await IssueManager.instance.deleteReactions(item.id);
_subtractionIssueBean(issueBean, content);
sink.add(bean);
return response;
}
IssueBean _subtractionIssueBean(IssueBean issueBean, String comment) {
if ("+1" == comment) {
issueBean.reaction.like--;
} else if ("-1" == comment) {
issueBean.reaction.noLike--;
} else if ("hooray" == comment) {
issueBean.reaction.hooray--;
} else if ("eyes" == comment) {
issueBean.reaction.eyes--;
} else if ("laugh" == comment) {
issueBean.reaction.laugh--;
} else if ("confused" == comment) {
issueBean.reaction.confused--;
} else if ("rocket" == comment) {
issueBean.reaction.rocket--;
} else if ("heart" == comment) {
issueBean.reaction.heart--;
}
return issueBean;
}
複製代碼
瀏覽器打開
涉及到的相關代碼以下所示
@override
void openWebView(BuildContext context) {
IssueDetailBloc bloc = BlocProvider.of<IssueDetailBloc>(context);
NavigatorUtil.goWebView(
context, bloc.getTitle(), bloc.bean.data?.issueBean?.htmlUrl);
}
複製代碼
分享
涉及到的相關代碼以下所示
void _share(BuildContext context) {
ShareUtil.share(getShareText(context));
}
@override
void openWebView(BuildContext context) {
IssueDetailBloc bloc = BlocProvider.of<IssueDetailBloc>(context);
NavigatorUtil.goWebView(
context, bloc.getTitle(), bloc.bean.data?.issueBean?.htmlUrl);
}
複製代碼
標籤
查詢項目標籤列表
相關api以下所示
GET /repos/:owner/:repo/labels
涉及到的相關代碼以下所示
Future _fetchLabelList() async {
LogUtil.v('_fetchLabelList', tag: TAG);
try {
var result = await IssueManager.instance.getLabel(owner, repo, page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {
if (page != 1) {
page--;
}
}
}
複製代碼
添加標籤
相關api以下所示
POST /repos/:owner/:repo/labels
涉及到的相關代碼以下所示
_editOrCreateLabel() async {
String name = _nameController.text.toString();
if (TextUtil.isEmpty(name)) {
ToastUtil.showMessgae('名稱不能爲空');
return;
}
String desc = _descController.text.toString() ?? '';
UserBean userBean = LoginManager.instance.getUserBean();
String owner = userBean?.login;
String color = ColorUtil.color2RGB(_currentColor);
_showLoading();
var response;
if (_isCreate) {
response = await IssueManager.instance
.createLabel(owner, widget.repo, name, color, desc);
} else {
response = await IssueManager.instance
.updateLabel(owner, widget.repo, widget.item.name, name, color, desc);
}
if (response != null && response.result) {
Labels labels = Labels(widget.item?.id, widget.item?.nodeId,
widget.item?.url, name, desc, color, widget.item?.default_);
Navigator.pop(context, labels);
} else {
ToastUtil.showMessgae('操做失敗，請重試');
}
_hideLoading();
}
複製代碼
編輯標籤
相關api以下所示
PATCH /repos/:owner/:repo/labels/:current_name
涉及到的相關代碼以下所示
_editOrCreateLabel() async {
String name = _nameController.text.toString();
if (TextUtil.isEmpty(name)) {
ToastUtil.showMessgae('名稱不能爲空');
return;
}
String desc = _descController.text.toString() ?? '';
UserBean userBean = LoginManager.instance.getUserBean();
String owner = userBean?.login;
String color = ColorUtil.color2RGB(_currentColor);
_showLoading();
var response;
if (_isCreate) {
response = await IssueManager.instance
.createLabel(owner, widget.repo, name, color, desc);
} else {
response = await IssueManager.instance
.updateLabel(owner, widget.repo, widget.item.name, name, color, desc);
}
if (response != null && response.result) {
Labels labels = Labels(widget.item?.id, widget.item?.nodeId,
widget.item?.url, name, desc, color, widget.item?.default_);
Navigator.pop(context, labels);
} else {
ToastUtil.showMessgae('操做失敗，請重試');
}
_hideLoading();
}
複製代碼
刪除標籤
相關api以下所示
DELETE /repos/:owner/:repo/labels/:name
涉及到的相關代碼以下所示
void _deleteLabel() async {
UserBean userBean = LoginManager.instance.getUserBean();
String owner = userBean?.login;
_showLoading();
var response = await IssueManager.instance
.deleteLabel(owner, widget.repo, widget.item.name);
if (response != null && response.result) {
widget.item.id = -1;
Navigator.pop(context, widget.item);
} else {
ToastUtil.showMessgae('操做失敗，請重試');
}
_hideLoading();
}
複製代碼
添加某個問題的標籤
相關api以下所示
POST /repos/:owner/:repo/issues/:issue_number/labels
涉及到的相關代碼以下所示
void addIssueLabel(Labels label) async {
showLoading();
var result = await IssueManager.instance
.addIssueLabel(owner, repo, issueNum, label.name);
if (result != null && result.result) {
if (labels == null) {
labels = [];
}
labels.add(label);
} else {
ToastUtil.showMessgae('操做失敗，請重試');
}
hideLoading();
}
複製代碼
刪除某個問題的標籤
相關api以下所示
DELETE /repos/:owner/:repo/issues/:issue_number/labels/:name
涉及到的相關代碼以下所示
void deleteIssueLabel(String name) async {
showLoading();
var result = await IssueManager.instance
.deleteIssueLabel(owner, repo, issueNum, name);
if (result != null && result.result) {
if (labels != null) {
int deleteIndex = -1;
for (int i = 0; i < labels.length; i++) {
Labels item = labels[i];
if (TextUtil.equals(item.name, name)) {
deleteIndex = i;
}
}
if (deleteIndex != null) {
labels.removeAt(deleteIndex);
}
}
} else {
ToastUtil.showMessgae('操做失敗，請重試');
}
hideLoading();
}
複製代碼
用戶資料頁
用戶資料頁展現了用戶的暱稱、簡介、項目列表、star項目列表、關注列表、被關注列表、動態、所在組織、公司、地址、郵箱、博客等信息。首次進入用戶資料頁時，會查詢該用戶的詳情以及關注狀態，相關api以下所示
- 用戶資料
GET /users/:name
- 關注狀態
GET /user/following/:name
涉及到的相關代碼以下所示
Future _fetchProfile() async {
final result = await UserManager.instance.getUserInfo(name);
bean.data = result;
if (result == null) {
bean.isError = true;
} else {
bean.isError = false;
}
}
Future _fetchFollow() async {
if (!UserManager.instance.isYou(name) && bean.data != null) {
final response = await UserManager.instance.isFollow(name);
bool isFollow = false;
if (response != null && response.result) {
isFollow = true;
}
bean.data.isFollow = isFollow;
}
}
複製代碼
在查詢關注狀態時，須要判斷該用戶是不是本身，若是是，則不進行查詢操做
關注用戶
相關api以下所示
PUT /user/following/:username
涉及到的相關代碼以下所示
Future _follow() async {
final response = await UserManager.instance.follow(name);
if (response != null && response.result) {
bean.data.isFollow = true;
sink.add(bean);
} else {
ToastUtil.showMessgae('操做失敗請重試');
}
}
複製代碼
取消關注用戶
相關api以下所示
DELETE /user/following/:username
涉及到的相關代碼以下所示
Future _follow() async {
final response = await UserManager.instance.follow(name);
if (response != null && response.result) {
bean.data.isFollow = true;
sink.add(bean);
} else {
ToastUtil.showMessgae('操做失敗請重試');
}
}
複製代碼
項目列表
見上文的項目頁
star項目列表
相關api以下所示
GET /users/:username/starred
涉及到的相關代碼以下所示
@override
fetchRepos(int page) async {
return await ReposManager.instance.getUserRepos(userName, page, null, true);
}
複製代碼
因爲repo_user_star_bloc.dart繼承repo_bloc.dart因此只需實現fetchRepos便可，具體細節能夠在上文查看
關注列表
相關api以下所示
GET /users/:username/following
涉及到的相關代碼以下所示
@override
fetchList(int page) async {
return await UserManager.instance.getUserFollower(userName, page);
}
複製代碼
因爲following_bloc繼承user_bloc因此只需實現fetchList便可，具體細節能夠在上文查看
被關注列表
相關api以下所示
GET /users/:username/followers
涉及到的相關代碼以下所示
@override
fetchList(int page) async {
return await UserManager.instance.getUserFollowing(userName, page);
}
複製代碼
因爲followers_bloc繼承user_bloc因此只需實現fetchList便可，具體細節能夠在上文查看
動態
相關api以下所示
GET users/:userName/events
涉及到的相關代碼以下所示
@override
fetchEvent(int page) async {
return await EventManager.instance.getEvent(userName, page);
}
複製代碼
因爲user_event_bloc繼承event_bloc因此只需實現fetchEvent便可，具體細節能夠在上文查看
組織
相關api以下所示
GET users/:userName/orgs
涉及到的相關代碼以下所示
Future _fetchProfile() async {
final result = await UserManager.instance.getOrgs(name, page);
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null) {
bean.isError = false;
noMore = result.length != Config.PAGE_SIZE;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
}
複製代碼
編輯資料
編輯資料頁支持暱稱、郵箱、博客、公司、所在地、簡介的編輯，相關api以下所示
PATCH /user
涉及到的相關代碼以下所示
void _editProfile() async {
String name = _name.text;
String email = _email.text;
String blog = _blog.text;
String company = _company.text;
String location = _location.text;
String bio = _bio.text;
if (TextUtil.equals(name, _userBean.name) &&
TextUtil.equals(email, _userBean.email) &&
TextUtil.equals(blog, _userBean.blog) &&
TextUtil.equals(company, _userBean.company) &&
TextUtil.equals(location, _userBean.location) &&
TextUtil.equals(bio, _userBean.bio)) {
ToastUtil.showMessgae('沒有進行任何修改，請從新操做');
return;
}
_showLoading();
var response = await UserManager.instance
.updateProfile(name, email, blog, company, location, bio);
if (response != null && response.result) {
_userBean.name = name;
_userBean.email = email;
_userBean.blog = blog;
_userBean.company = company;
_userBean.location = location;
_userBean.bio = bio;
LoginManager.instance.setUserBean(_userBean.toJson, true);
Navigator.pop(context);
} else {
ToastUtil.showMessgae('操做失敗，請重試');
}
_hideLoading();
}
複製代碼
搜索頁面
搜索項目頁
相關api以下所示
GET search/repositories?q=:query
涉及到的相關代碼以下所示
void startSearch(String text) async {
searchText = text;
showLoading();
await _searchText();
hideLoading();
refreshStatusEvent();
}
Future _searchText() async {
final response =
await SearchManager.instance.getIssue(type, searchText, page);
if (response != null && response.result) {
dealResult(response.data);
}
}
@override
void dealResult(result) {
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null && result.length > 0) {
var items = result["items"];
noMore = items.length != Config.PAGE_SIZE;
for (int i = 0; i < items.length; i++) {
var dataItem = items[i];
Repository repository = Repository.fromJson(dataItem);
repository.description =
ReposUtil.getGitHubEmojHtml(repository.description ?? "暫無描述");
bean.data.add(repository);
}
} else {
bean.isError = true;
}
sink.add(bean);
}
複製代碼
搜索用戶頁
相關api以下所示
GET search/users?q=:query
涉及到的相關代碼以下所示
void startSearch(String text) async {
searchText = text;
showLoading();
await _searchText();
hideLoading();
refreshStatusEvent();
}
Future _searchText() async {
final response =
await SearchManager.instance.getIssue(type, searchText, page);
if (response != null && response.result) {
dealResult(response.data);
}
}
@override
void dealResult(result) {
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null && result.length > 0) {
var items = result["items"];
noMore = items.length != Config.PAGE_SIZE;
for (int i = 0; i < items.length; i++) {
var dataItem = items[i];
UserBean user = UserBean.fromJson(dataItem);
bean.data.add(user);
}
} else {
bean.isError = true;
}
sink.add(bean);
}
複製代碼
搜索問題頁
相關api以下所示
GET search/issues?q=:query
涉及到的相關代碼以下所示
void startSearch(String text) async {
searchText = text;
showLoading();
await _searchText();
hideLoading();
refreshStatusEvent();
}
Future _searchText() async {
final response =
await SearchManager.instance.getIssue(type, searchText, page);
if (response != null && response.result) {
dealResult(response.data);
}
}
@override
void dealResult(result) {
if (bean.data == null) {
bean.data = List();
}
if (page == 1) {
bean.data.clear();
}
noMore = true;
if (result != null && result.length > 0) {
var items = result["items"];
noMore = items.length != Config.PAGE_SIZE;
for (int i = 0; i < items.length; i++) {
var dataItem = items[i];
IssueBean issue = IssueBean.fromJson(dataItem);
bean.data.add(issue);
}
} else {
bean.isError = true;
}
sink.add(bean);
}
複製代碼
趨勢頁
趨勢頁分爲項目和用戶兩種趨勢，支持按照時間和語言種類的篩選，api主要參考Github-trending-api
項目頁
相關api以下所示
涉及到的相關代碼以下所示
Future _fetchTrendList() async {
LogUtil.v('_fetchTrendList', tag: TAG);
try {
var result = await TrendingManager.instance.getRepos(language, since);
if (bean.data == null) {
bean.data = List();
}
bean.data.clear();
if (result != null) {
bean.isError = false;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {}
}
複製代碼
用戶頁
相關api以下所示
涉及到的相關代碼以下所示
Future _fetchTrendList() async {
LogUtil.v('_fetchTrendList', tag: TAG);
try {
var result = await TrendingManager.instance.getUser(language, since);
if (bean.data == null) {
bean.data = List();
}
bean.data.clear();
if (result != null) {
bean.isError = false;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {}
}
複製代碼
語言列表頁
語言頁面能夠參考文章Flutter側邊欄控件-SideBar
相關api以下所示
涉及到的相關代碼以下所示
Future _fetchTrendList() async {
LogUtil.v('_fetchTrendList', tag: TAG);
try {
var result = await TrendingManager.instance.getUser(language, since);
if (bean.data == null) {
bean.data = List();
}
bean.data.clear();
if (result != null) {
bean.isError = false;
bean.data.addAll(result);
} else {
bean.isError = true;
}
sink.add(bean);
} catch (_) {}
}
複製代碼
Android版安裝包：
掃碼下載
項目地址
關於做者
相關文章
- 1. 用Flutter開發一個github客戶端
- 2. 仿WanAndroid客戶端Flutter版
- 3. Flutter 仿微博客戶端
- 4. Flutter 仿寫的掘金客戶端
- 5. 使用Electron-vue開發的客戶端支付收款工具
- 6. 玩Android-Flutter客戶端開發
- 7. 一款Flutter實現的Github客戶端之OpenGit
- 8. Flutter項目-------一款以Redux爲架構的Wan Android客戶端
- 9. 使用 Flutter 開發知識小集 iOS/Android 客戶端
- 10. Flutter GitLab 客戶端
- 更多相關文章...
- • XSLT - 在客戶端 - XSLT 教程
- • MySQL客戶端和服務器端工具集 - MySQL教程
- • PHP開發工具
- • Java Agent入門實戰（一）-Instrumentation介紹與使用
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
最新文章
- 1. vs2019運行opencv圖片顯示代碼時，窗口亂碼
- 2. app自動化 - 元素定位不到？別慌，看完你就能解決
- 3. 在Win8下用cisco ××× Client連接時報Reason 422錯誤的解決方法
- 4. eclipse快速補全代碼
- 5. Eclipse中Java/Html/Css/Jsp/JavaScript等代碼的格式化
- 6. idea+spring boot +mabitys(wanglezapin)+mysql (1)
- 7. 勒索病毒發生變種 新文件名將帶有「.UIWIX」後綴
- 8. 【原創】Python 源文件編碼解讀
- 9. iOS9企業部署分發問題深入瞭解與解決
- 10. 安裝pytorch報錯CondaHTTPError：******
歡迎關注本站公眾號,獲取更多信息
