├── App.js ├── README.md ├── __tests__ └── App-test.js ├── android ├── app │ ├── BUCK │ ├── build.gradle │ ├── build_defs.bzl │ ├── debug.keystore │ ├── proguard-rules.pro │ └── src │ │ ├── debug │ │ └── AndroidManifest.xml │ │ └── main │ │ ├── AndroidManifest.xml │ │ ├── assets │ │ └── fonts │ │ │ ├── AntDesign.ttf │ │ │ ├── Entypo.ttf │ │ │ ├── EvilIcons.ttf │ │ │ ├── Feather.ttf │ │ │ ├── FontAwesome.ttf │ │ │ ├── FontAwesome5_Brands.ttf │ │ │ ├── FontAwesome5_Regular.ttf │ │ │ ├── FontAwesome5_Solid.ttf │ │ │ ├── Fontisto.ttf │ │ │ ├── Foundation.ttf │ │ │ ├── Ionicons.ttf │ │ │ ├── MaterialCommunityIcons.ttf │ │ │ ├── MaterialIcons.ttf │ │ │ ├── Octicons.ttf │ │ │ ├── Roboto.ttf │ │ │ ├── Roboto_medium.ttf │ │ │ ├── SimpleLineIcons.ttf │ │ │ ├── Zocial.ttf │ │ │ └── rubicon-icon-font.ttf │ │ ├── java │ │ └── com │ │ │ └── react_blibli │ │ │ ├── MainActivity.java │ │ │ └── MainApplication.java │ │ └── res │ │ ├── mipmap-hdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-mdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xxhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ ├── mipmap-xxxhdpi │ │ ├── ic_launcher.png │ │ └── ic_launcher_round.png │ │ └── values │ │ ├── strings.xml │ │ └── styles.xml ├── build.gradle ├── gradle.properties ├── gradle │ └── wrapper │ │ ├── gradle-wrapper.jar │ │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat └── settings.gradle ├── app.json ├── babel.config.js ├── index.js ├── ios ├── Podfile ├── react_blibli-tvOS │ └── Info.plist ├── react_blibli-tvOSTests │ └── Info.plist ├── react_blibli.xcodeproj │ ├── project.pbxproj │ └── xcshareddata │ │ └── xcschemes │ │ ├── react_blibli-tvOS.xcscheme │ │ └── react_blibli.xcscheme ├── react_blibli │ ├── AppDelegate.h │ ├── AppDelegate.m │ ├── Base.lproj │ │ └── LaunchScreen.xib │ ├── Images.xcassets │ │ ├── AppIcon.appiconset │ │ │ └── Contents.json │ │ └── Contents.json │ ├── Info.plist │ └── main.m └── react_blibliTests │ ├── Info.plist │ └── react_blibliTests.m ├── metro.config.js ├── package-lock.json ├── package.json ├── router.js ├── src ├── assets │ ├── icons │ │ └── font_bilibili │ │ │ ├── demo.css │ │ │ ├── demo_index.html │ │ │ ├── iconfont.css │ │ │ ├── iconfont.eot │ │ │ ├── iconfont.js │ │ │ ├── iconfont.svg │ │ │ ├── iconfont.ttf │ │ │ ├── iconfont.woff │ │ │ └── iconfont.woff2 │ └── images │ │ ├── QR.png │ │ ├── bangumi_home_login_guide.png │ │ ├── bili_default_avatar.png │ │ ├── dynamic_login_guide.png │ │ ├── fengmian1.jpg │ │ ├── fengmian2.jpg │ │ ├── fengmian3.jpg │ │ ├── head_icon.jpg │ │ ├── ic_empty.png │ │ ├── ic_loading.png │ │ ├── ic_loading_error.png │ │ ├── ic_null.png │ │ ├── ic_player_coin.png │ │ ├── ic_player_danmaku_input_options_rl_disabled.png │ │ ├── ic_tv_play.png │ │ ├── ic_tv_play_large.png │ │ ├── img_tips_error_load_error.png │ │ ├── live_background.png │ │ ├── login_logo_account.png │ │ ├── login_logo_password.png │ │ ├── me_tv_sign_in.png │ │ ├── me_tv_sign_out.png │ │ ├── partitions.png │ │ ├── splashpage.jpg │ │ ├── timg.gif │ │ └── 小电视.png ├── components │ ├── BanItem.js │ ├── BanMore.js │ ├── GuoItem.js │ ├── MovieOne.js │ ├── MovieThree.js │ └── MovieTwo.js └── pages │ ├── Classify.js │ ├── Dynamic.js │ ├── HomePage.js │ ├── MemberBuy.js │ └── home_sub_pages │ ├── Bangumi.js │ ├── Hot.js │ ├── Live.js │ ├── Movie.js │ ├── Recommended.js │ └── SeventyYears.js ├── vue.config.js └── yarn.lock /App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text, StyleSheet, TouchableHighlight } from 'react-native' 3 | import TabNavigator from 'react-native-tab-navigator' 4 | import { Container, Header, Title, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 5 | 6 | 7 | 8 | import HomePage from './src/pages/HomePage'; 9 | import Classify from './src/pages/Classify'; 10 | import Dynamic from './src/pages/Dynamic'; 11 | import MemberBuy from './src/pages/MemberBuy'; 12 | 13 | 14 | 15 | const App: () => React$Node = () => { 16 | const [selectedTab, onChangeSelectedTab] = React.useState("首页") 17 | 18 | 19 | return ( 20 | 21 | {/* 头部 */} 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | {selectedTab} 31 | 32 | 33 | 36 | 37 |
38 | 39 | 41 | {/* HomePage Tab栏 */} 42 | } // 未选中状态下，展示的图标 46 | renderSelectedIcon={() => } 47 | onPress={() => onChangeSelectedTab("首页")} // 点击Tab栏的操作 48 | selected={selectedTab === '首页'} // 判断当前的 tab栏是否被选中的 49 | > 50 | 51 | 52 | {/* Classify Tab栏 */} 53 | onChangeSelectedTab("频道")} // 点击Tab栏的操作 58 | renderIcon={() => } // 未选中状态下，展示的图标 59 | renderSelectedIcon={() => } 60 | > 61 | 62 | 63 | onChangeSelectedTab("动态")} // 点击Tab栏的操作 68 | renderIcon={() => } // 未选中状态下，展示的图标 69 | renderSelectedIcon={() => } 70 | > 71 | 72 | 73 | {/* MemberBuy Tab栏 */} 74 | onChangeSelectedTab("会员购")} 79 | renderIcon={() => } // 未选中状态下，展示的图标 80 | renderSelectedIcon={() => } 81 | > 82 | 83 | 84 | 85 | 86 | ); 87 | } 88 | 89 | 90 | 91 | 92 | export default App; -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ### 仿哔哩哔哩的React Native项目 实先视频，直播播放等功能，会员购页面正在改进中。。。 2 | 3 | ### npm i 4 | 5 | ### react-native link 6 | 7 | ### react-native run-android 8 | 9 | ``` 10 | src 目录结构 11 | ├─ assets 12 | │ ├─ icons //字体图标 13 | │ │ ├─ font_bilibili 14 | │ │ ├─ mybilibil_font 15 | │ │ └─ myiconfont.ttf 16 | │ └─ images //所需图片 17 | │ ├─ QR.png 18 | │ ├─ acfun.png 19 | │ ├─ back.png 20 | │ ├─ back_live.png 21 | │ ├─ bangumi_home_login_guide.png 22 | │ ├─ bili_default_avatar.png 23 | │ ├─ billiveperson.png 24 | │ ├─ black.jpg 25 | │ ├─ dots.png 26 | │ ├─ dynamic_login_guide.png 27 | │ ├─ fengmian1.jpg 28 | │ ├─ fengmian2.jpg 29 | │ ├─ fengmian3.jpg 30 | │ ├─ fullscreen-exit.png 31 | │ ├─ fullscreen.png 32 | │ ├─ head_icon.jpg 33 | │ ├─ horline.png 34 | │ ├─ ic_empty.png 35 | │ ├─ ic_loading.png 36 | │ ├─ ic_loading_error.png 37 | │ ├─ ic_null.png 38 | │ ├─ ic_player_coin.png 39 | │ ├─ ic_player_danmaku_input_options_rl_disabled.png 40 | │ ├─ ic_tv_play.png 41 | │ ├─ ic_tv_play_large.png 42 | │ ├─ icon.png 43 | │ ├─ icon_bilibili.png 44 | │ ├─ icon_empty.png 45 | │ ├─ img_tips_error_load_error.png 46 | │ ├─ jianbian.png 47 | │ ├─ liveNext.png 48 | │ ├─ live_background.png 49 | │ ├─ live_banner1.jpg 50 | │ ├─ live_banner2.png 51 | │ ├─ live_banner3.jpg 52 | │ ├─ livego.png 53 | │ ├─ login_logo_account.png 54 | │ ├─ login_logo_password.png 55 | │ ├─ me_tv_sign_in.png 56 | │ ├─ me_tv_sign_out.png 57 | │ ├─ paihang.png 58 | │ ├─ partitions.png 59 | │ ├─ pause.png 60 | │ ├─ play.png 61 | │ ├─ splashpage.jpg 62 | │ ├─ timg.gif 63 | │ ├─ volume-off-outline.png 64 | │ ├─ volume-up-outline.png 65 | │ └─ 小电视.png 66 | ├─ components //部分组件 67 | │ ├─ AppDraw 68 | │ │ └─ land.js 69 | │ ├─ BanMore.js 70 | │ ├─ Bangumi 71 | │ │ ├─ BanItem.js 72 | │ │ └─ BmSwiper.js 73 | │ ├─ ListItemUI.js 74 | │ ├─ Live 75 | │ │ └─ LiveItemUI.js 76 | │ ├─ MemberBuy 77 | │ │ ├─ GoodList.js 78 | │ │ ├─ Tabs.js 79 | │ │ ├─ TabsList.js 80 | │ │ ├─ ThreeList.js 81 | │ │ ├─ Top.js 82 | │ │ └─ UnGoodList.js 83 | │ └─ Move 84 | │ └─ MoveItem.js 85 | ├─ pages //主页面 86 | │ ├─ Classify.js 87 | │ ├─ HomePage.js 88 | │ ├─ MemberBuy.js 89 | │ ├─ Search.js 90 | │ ├─ home_sub_pages 91 | │ │ ├─ Bangumi.js 92 | │ │ ├─ Hot.js 93 | │ │ ├─ Live.js 94 | │ │ ├─ Move.js 95 | │ │ ├─ Recommended.js 96 | │ │ ├─ SeventyYears.js 97 | │ │ └─ home_live 98 | │ ├─ search_sub_pages 99 | │ │ └─ SearchResult.js 100 | │ ├─ vidoe_player 101 | │ │ ├─ VideoComment.js 102 | │ │ ├─ VideoPage.js 103 | │ │ ├─ VideoPlayer.js 104 | │ │ └─ ViderDetilInfo.js 105 | │ └─ webView 106 | │ └─ webView.js 107 | ├─ store 108 | │ ├─ actionCreaters.js 109 | │ ├─ actionTypes.js 110 | │ ├─ index.js 111 | │ └─ reducer.js 112 | └─ utils //工具类 113 | └─ utils.js 114 | ``` 115 | 116 | ``` 117 | //所需插件 118 | "@react-native-community/viewpager": "^3.3.0", 119 | "moment": "^2.24.0", 120 | "native-base": "^2.13.8", 121 | "react": "16.9.0", 122 | "react-native": "0.61.5", 123 | "react-native-md5": "^1.0.0", 124 | "react-native-modal-dropdown": "^0.7.0", 125 | "react-native-orientation": "^3.1.3", 126 | "react-native-router-flux": "^4.0.6", 127 | "react-native-scrollable-tab-view": "^1.0.0", 128 | "react-native-shadow-cards": "^1.0.2", 129 | "react-native-splash-screen": "^3.2.0", 130 | "react-native-svg": "^11.0.1", 131 | "react-native-swiper": "^1.6.0-nightly.5", 132 | "react-native-tab-navigator": "^0.3.4", 133 | "react-native-vector-icons": "^6.6.0", 134 | "react-native-video": "^5.0.2", 135 | "react-native-webview": "^8.0.6", 136 | "react-redux": "^7.1.3", 137 | "redux": "^4.0.5", 138 | "text-encoding": "^0.7.0" 139 | ``` 140 | 141 | 142 | 143 | ### 1启动页 144 | 145 | ![](https://s2.ax1x.com/2020/02/18/3FPlQI.md.png) 146 | 147 | ### 2频道页面 148 | 149 | ![](https://s2.ax1x.com/2020/02/18/3FP1yt.md.png) 150 | 151 | ### 3 搜索页面 152 | 153 | ![](https://s2.ax1x.com/2020/02/18/3FPGef.md.png) 154 | 155 | ### 4 搜索推荐词 156 | 157 | ![](https://s2.ax1x.com/2020/02/18/3FPYTS.md.png) 158 | 159 | ### 5搜索结果页面 160 | 161 | ![](https://s2.ax1x.com/2020/02/18/3FPNFg.md.png) 162 | 163 | ### 5直播推荐页面 164 | 165 | ![](https://s2.ax1x.com/2020/02/18/3FPUYQ.md.png) 166 | 167 | ### 5 直播详情页面 168 | 169 | ![](https://s2.ax1x.com/2020/02/18/3FPaWj.md.png) 170 | 171 | ### 6首页视频推荐 172 | 173 | ![](https://s2.ax1x.com/2020/02/18/3FPwSs.md.png) 174 | 175 | ### 7 热门排行页面 176 | 177 | ![](https://s2.ax1x.com/2020/02/18/3FPsmV.md.png) 178 | 179 | ### 8视频详情页面 180 | 181 | ![](https://s2.ax1x.com/2020/02/18/3FPfp9.md.png) 182 | 183 | ![](https://s2.ax1x.com/2020/02/18/3FP5Ox.md.png) 184 | 185 | - 全屏效果（弹幕效果待做。。。） 186 | 187 | ![](https://s2.ax1x.com/2020/02/18/3FP461.md.png) 188 | 189 | ### 9番剧页面 190 | 191 | ![](https://s2.ax1x.com/2020/02/18/3FPywT.md.png) 192 | 193 | ### 10影视页面 194 | 195 | ![](https://s2.ax1x.com/2020/02/18/3FP6TU.md.png) 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | -------------------------------------------------------------------------------- /__tests__/App-test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @format 3 | */ 4 | 5 | import 'react-native'; 6 | import React from 'react'; 7 | import App from '../App'; 8 | 9 | // Note: test renderer must be required after react-native. 10 | import renderer from 'react-test-renderer'; 11 | 12 | it('renders correctly', () => { 13 | renderer.create(); 14 | }); 15 | -------------------------------------------------------------------------------- /android/app/BUCK: -------------------------------------------------------------------------------- 1 | # To learn about Buck see [Docs](https://buckbuild.com/). 2 | # To run your application with Buck: 3 | # - install Buck 4 | # - `npm start` - to start the packager 5 | # - `cd android` 6 | # - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"` 7 | # - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck 8 | # - `buck install -r android/app` - compile, install and run application 9 | # 10 | 11 | load(":build_defs.bzl", "create_aar_targets", "create_jar_targets") 12 | 13 | lib_deps = [] 14 | 15 | create_aar_targets(glob(["libs/*.aar"])) 16 | 17 | create_jar_targets(glob(["libs/*.jar"])) 18 | 19 | android_library( 20 | name = "all-libs", 21 | exported_deps = lib_deps, 22 | ) 23 | 24 | android_library( 25 | name = "app-code", 26 | srcs = glob([ 27 | "src/main/java/**/*.java", 28 | ]), 29 | deps = [ 30 | ":all-libs", 31 | ":build_config", 32 | ":res", 33 | ], 34 | ) 35 | 36 | android_build_config( 37 | name = "build_config", 38 | package = "com.react_blibli", 39 | ) 40 | 41 | android_resource( 42 | name = "res", 43 | package = "com.react_blibli", 44 | res = "src/main/res", 45 | ) 46 | 47 | android_binary( 48 | name = "app", 49 | keystore = "//android/keystores:debug", 50 | manifest = "src/main/AndroidManifest.xml", 51 | package_type = "debug", 52 | deps = [ 53 | ":app-code", 54 | ], 55 | ) 56 | -------------------------------------------------------------------------------- /android/app/build.gradle: -------------------------------------------------------------------------------- 1 | apply plugin: "com.android.application" 2 | 3 | import com.android.build.OutputFile 4 | 5 | /** 6 | * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets 7 | * and bundleReleaseJsAndAssets). 8 | * These basically call `react-native bundle` with the correct arguments during the Android build 9 | * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the 10 | * bundle directly from the development server. Below you can see all the possible configurations 11 | * and their defaults. If you decide to add a configuration block, make sure to add it before the 12 | * `apply from: "../../node_modules/react-native/react.gradle"` line. 13 | * 14 | * project.ext.react = [ 15 | * // the name of the generated asset file containing your JS bundle 16 | * bundleAssetName: "index.android.bundle", 17 | * 18 | * // the entry file for bundle generation 19 | * entryFile: "index.android.js", 20 | * 21 | * // https://facebook.github.io/react-native/docs/performance#enable-the-ram-format 22 | * bundleCommand: "ram-bundle", 23 | * 24 | * // whether to bundle JS and assets in debug mode 25 | * bundleInDebug: false, 26 | * 27 | * // whether to bundle JS and assets in release mode 28 | * bundleInRelease: true, 29 | * 30 | * // whether to bundle JS and assets in another build variant (if configured). 31 | * // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants 32 | * // The configuration property can be in the following formats 33 | * // 'bundleIn${productFlavor}${buildType}' 34 | * // 'bundleIn${buildType}' 35 | * // bundleInFreeDebug: true, 36 | * // bundleInPaidRelease: true, 37 | * // bundleInBeta: true, 38 | * 39 | * // whether to disable dev mode in custom build variants (by default only disabled in release) 40 | * // for example: to disable dev mode in the staging build type (if configured) 41 | * devDisabledInStaging: true, 42 | * // The configuration property can be in the following formats 43 | * // 'devDisabledIn${productFlavor}${buildType}' 44 | * // 'devDisabledIn${buildType}' 45 | * 46 | * // the root of your project, i.e. where "package.json" lives 47 | * root: "../../", 48 | * 49 | * // where to put the JS bundle asset in debug mode 50 | * jsBundleDirDebug: "$buildDir/intermediates/assets/debug", 51 | * 52 | * // where to put the JS bundle asset in release mode 53 | * jsBundleDirRelease: "$buildDir/intermediates/assets/release", 54 | * 55 | * // where to put drawable resources / React Native assets, e.g. the ones you use via 56 | * // require('./image.png')), in debug mode 57 | * resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", 58 | * 59 | * // where to put drawable resources / React Native assets, e.g. the ones you use via 60 | * // require('./image.png')), in release mode 61 | * resourcesDirRelease: "$buildDir/intermediates/res/merged/release", 62 | * 63 | * // by default the gradle tasks are skipped if none of the JS files or assets change; this means 64 | * // that we don't look at files in android/ or ios/ to determine whether the tasks are up to 65 | * // date; if you have any other folders that you want to ignore for performance reasons (gradle 66 | * // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ 67 | * // for example, you might want to remove it from here. 68 | * inputExcludes: ["android/**", "ios/**"], 69 | * 70 | * // override which node gets called and with what additional arguments 71 | * nodeExecutableAndArgs: ["node"], 72 | * 73 | * // supply additional arguments to the packager 74 | * extraPackagerArgs: [] 75 | * ] 76 | */ 77 | 78 | project.ext.react = [ 79 | entryFile: "index.js", 80 | enableHermes: false, // clean and rebuild if changing 81 | ] 82 | 83 | apply from: "../../node_modules/react-native/react.gradle" 84 | 85 | /** 86 | * Set this to true to create two separate APKs instead of one: 87 | * - An APK that only works on ARM devices 88 | * - An APK that only works on x86 devices 89 | * The advantage is the size of the APK is reduced by about 4MB. 90 | * Upload all the APKs to the Play Store and people will download 91 | * the correct one based on the CPU architecture of their device. 92 | */ 93 | def enableSeparateBuildPerCPUArchitecture = false 94 | 95 | /** 96 | * Run Proguard to shrink the Java bytecode in release builds. 97 | */ 98 | def enableProguardInReleaseBuilds = false 99 | 100 | /** 101 | * The preferred build flavor of JavaScriptCore. 102 | * 103 | * For example, to use the international variant, you can use: 104 | * `def jscFlavor = 'org.webkit:android-jsc-intl:+'` 105 | * 106 | * The international variant includes ICU i18n library and necessary data 107 | * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that 108 | * give correct results when using with locales other than en-US. Note that 109 | * this variant is about 6MiB larger per architecture than default. 110 | */ 111 | def jscFlavor = 'org.webkit:android-jsc:+' 112 | 113 | /** 114 | * Whether to enable the Hermes VM. 115 | * 116 | * This should be set on project.ext.react and mirrored here. If it is not set 117 | * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode 118 | * and the benefits of using Hermes will therefore be sharply reduced. 119 | */ 120 | def enableHermes = project.ext.react.get("enableHermes", false); 121 | 122 | android { 123 | compileSdkVersion rootProject.ext.compileSdkVersion 124 | 125 | compileOptions { 126 | sourceCompatibility JavaVersion.VERSION_1_8 127 | targetCompatibility JavaVersion.VERSION_1_8 128 | } 129 | 130 | defaultConfig { 131 | applicationId "com.react_blibli" 132 | minSdkVersion rootProject.ext.minSdkVersion 133 | targetSdkVersion rootProject.ext.targetSdkVersion 134 | versionCode 1 135 | versionName "1.0" 136 | } 137 | splits { 138 | abi { 139 | reset() 140 | enable enableSeparateBuildPerCPUArchitecture 141 | universalApk false // If true, also generate a universal APK 142 | include "armeabi-v7a", "x86", "arm64-v8a", "x86_64" 143 | } 144 | } 145 | signingConfigs { 146 | debug { 147 | storeFile file('debug.keystore') 148 | storePassword 'android' 149 | keyAlias 'androiddebugkey' 150 | keyPassword 'android' 151 | } 152 | } 153 | buildTypes { 154 | debug { 155 | signingConfig signingConfigs.debug 156 | } 157 | release { 158 | // Caution! In production, you need to generate your own keystore file. 159 | // see https://facebook.github.io/react-native/docs/signed-apk-android. 160 | signingConfig signingConfigs.debug 161 | minifyEnabled enableProguardInReleaseBuilds 162 | proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro" 163 | } 164 | } 165 | // applicationVariants are e.g. debug, release 166 | applicationVariants.all { variant -> 167 | variant.outputs.each { output -> 168 | // For each separate APK per architecture, set a unique version code as described here: 169 | // https://developer.android.com/studio/build/configure-apk-splits.html 170 | def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4] 171 | def abi = output.getFilter(OutputFile.ABI) 172 | if (abi != null) { // null for the universal-debug, universal-release variants 173 | output.versionCodeOverride = 174 | versionCodes.get(abi) * 1048576 + defaultConfig.versionCode 175 | } 176 | 177 | } 178 | } 179 | } 180 | 181 | dependencies { 182 | implementation fileTree(dir: "libs", include: ["*.jar"]) 183 | implementation "com.facebook.react:react-native:+" // From node_modules 184 | 185 | if (enableHermes) { 186 | def hermesPath = "../../node_modules/hermes-engine/android/"; 187 | debugImplementation files(hermesPath + "hermes-debug.aar") 188 | releaseImplementation files(hermesPath + "hermes-release.aar") 189 | } else { 190 | implementation jscFlavor 191 | } 192 | } 193 | 194 | // Run this once to be able to run the application with BUCK 195 | // puts all compile dependencies into folder libs for BUCK to use 196 | task copyDownloadableDepsToLibs(type: Copy) { 197 | from configurations.compile 198 | into 'libs' 199 | } 200 | 201 | apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project) 202 | -------------------------------------------------------------------------------- /android/app/build_defs.bzl: -------------------------------------------------------------------------------- 1 | """Helper definitions to glob .aar and .jar targets""" 2 | 3 | def create_aar_targets(aarfiles): 4 | for aarfile in aarfiles: 5 | name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")] 6 | lib_deps.append(":" + name) 7 | android_prebuilt_aar( 8 | name = name, 9 | aar = aarfile, 10 | ) 11 | 12 | def create_jar_targets(jarfiles): 13 | for jarfile in jarfiles: 14 | name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")] 15 | lib_deps.append(":" + name) 16 | prebuilt_jar( 17 | name = name, 18 | binary_jar = jarfile, 19 | ) 20 | -------------------------------------------------------------------------------- /android/app/debug.keystore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/debug.keystore -------------------------------------------------------------------------------- /android/app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # By default, the flags in this file are appended to flags specified 3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt 4 | # You can edit the include path and order by changing the proguardFiles 5 | # directive in build.gradle. 6 | # 7 | # For more details, see 8 | # http://developer.android.com/guide/developing/tools/proguard.html 9 | 10 | # Add any project specific keep options here: 11 | -------------------------------------------------------------------------------- /android/app/src/debug/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /android/app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 3 | 4 | 5 | 6 | 13 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/AntDesign.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/AntDesign.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Entypo.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Entypo.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/EvilIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/EvilIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Feather.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Feather.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/FontAwesome.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/FontAwesome.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/FontAwesome5_Brands.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/FontAwesome5_Brands.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/FontAwesome5_Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/FontAwesome5_Regular.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/FontAwesome5_Solid.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/FontAwesome5_Solid.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Fontisto.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Fontisto.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Foundation.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Foundation.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Ionicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Ionicons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/MaterialIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/MaterialIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Octicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Octicons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Roboto.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Roboto.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Roboto_medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Roboto_medium.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/SimpleLineIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/SimpleLineIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Zocial.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/Zocial.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/rubicon-icon-font.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/assets/fonts/rubicon-icon-font.ttf -------------------------------------------------------------------------------- /android/app/src/main/java/com/react_blibli/MainActivity.java: -------------------------------------------------------------------------------- 1 | package com.react_blibli; 2 | 3 | import com.facebook.react.ReactActivity; 4 | 5 | public class MainActivity extends ReactActivity { 6 | 7 | /** 8 | * Returns the name of the main component registered from JavaScript. This is used to schedule 9 | * rendering of the component. 10 | */ 11 | @Override 12 | protected String getMainComponentName() { 13 | return "react_blibli"; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /android/app/src/main/java/com/react_blibli/MainApplication.java: -------------------------------------------------------------------------------- 1 | package com.react_blibli; 2 | 3 | import android.app.Application; 4 | import android.content.Context; 5 | import com.facebook.react.PackageList; 6 | import com.facebook.react.ReactApplication; 7 | import com.facebook.react.ReactNativeHost; 8 | import com.facebook.react.ReactPackage; 9 | import com.facebook.soloader.SoLoader; 10 | import java.lang.reflect.InvocationTargetException; 11 | import java.util.List; 12 | 13 | public class MainApplication extends Application implements ReactApplication { 14 | 15 | private final ReactNativeHost mReactNativeHost = 16 | new ReactNativeHost(this) { 17 | @Override 18 | public boolean getUseDeveloperSupport() { 19 | return BuildConfig.DEBUG; 20 | } 21 | 22 | @Override 23 | protected List getPackages() { 24 | @SuppressWarnings("UnnecessaryLocalVariable") 25 | List packages = new PackageList(this).getPackages(); 26 | // Packages that cannot be autolinked yet can be added manually here, for example: 27 | // packages.add(new MyReactNativePackage()); 28 | return packages; 29 | } 30 | 31 | @Override 32 | protected String getJSMainModuleName() { 33 | return "index"; 34 | } 35 | }; 36 | 37 | @Override 38 | public ReactNativeHost getReactNativeHost() { 39 | return mReactNativeHost; 40 | } 41 | 42 | @Override 43 | public void onCreate() { 44 | super.onCreate(); 45 | SoLoader.init(this, /* native exopackage */ false); 46 | initializeFlipper(this); // Remove this line if you don't want Flipper enabled 47 | } 48 | 49 | /** 50 | * Loads Flipper in React Native templates. 51 | * 52 | * @param context 53 | */ 54 | private static void initializeFlipper(Context context) { 55 | if (BuildConfig.DEBUG) { 56 | try { 57 | /* 58 | We use reflection here to pick up the class that initializes Flipper, 59 | since Flipper library is not available in release mode 60 | */ 61 | Class aClass = Class.forName("com.facebook.flipper.ReactNativeFlipper"); 62 | aClass.getMethod("initializeFlipper", Context.class).invoke(null, context); 63 | } catch (ClassNotFoundException e) { 64 | e.printStackTrace(); 65 | } catch (NoSuchMethodException e) { 66 | e.printStackTrace(); 67 | } catch (IllegalAccessException e) { 68 | e.printStackTrace(); 69 | } catch (InvocationTargetException e) { 70 | e.printStackTrace(); 71 | } 72 | } 73 | } 74 | } 75 | -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-hdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-hdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-mdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-mdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /android/app/src/main/res/values/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | react_blibli 3 | 4 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /android/build.gradle: -------------------------------------------------------------------------------- 1 | // Top-level build file where you can add configuration options common to all sub-projects/modules. 2 | 3 | buildscript { 4 | ext { 5 | buildToolsVersion = "28.0.3" 6 | minSdkVersion = 16 7 | compileSdkVersion = 28 8 | targetSdkVersion = 28 9 | } 10 | repositories { 11 | google() 12 | jcenter() 13 | } 14 | dependencies { 15 | classpath("com.android.tools.build:gradle:3.4.2") 16 | 17 | // NOTE: Do not place your application dependencies here; they belong 18 | // in the individual module build.gradle files 19 | } 20 | } 21 | 22 | allprojects { 23 | repositories { 24 | mavenLocal() 25 | maven { 26 | // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm 27 | url("$rootDir/../node_modules/react-native/android") 28 | } 29 | maven { 30 | // Android JSC is installed from npm 31 | url("$rootDir/../node_modules/jsc-android/dist") 32 | } 33 | 34 | google() 35 | jcenter() 36 | maven { url 'https://jitpack.io' } 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /android/gradle.properties: -------------------------------------------------------------------------------- 1 | # Project-wide Gradle settings. 2 | 3 | # IDE (e.g. Android Studio) users: 4 | # Gradle settings configured through the IDE *will override* 5 | # any settings specified in this file. 6 | 7 | # For more details on how to configure your build environment visit 8 | # http://www.gradle.org/docs/current/userguide/build_environment.html 9 | 10 | # Specifies the JVM arguments used for the daemon process. 11 | # The setting is particularly useful for tweaking memory settings. 12 | # Default value: -Xmx10248m -XX:MaxPermSize=256m 13 | # org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8 14 | 15 | # When configured, Gradle will run in incubating parallel mode. 16 | # This option should only be used with decoupled projects. More details, visit 17 | # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects 18 | # org.gradle.parallel=true 19 | 20 | android.useAndroidX=true 21 | android.enableJetifier=true 22 | -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.jar: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/android/gradle/wrapper/gradle-wrapper.jar -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | distributionBase=GRADLE_USER_HOME 2 | distributionPath=wrapper/dists 3 | distributionUrl=https\://services.gradle.org/distributions/gradle-5.5-all.zip 4 | zipStoreBase=GRADLE_USER_HOME 5 | zipStorePath=wrapper/dists 6 | -------------------------------------------------------------------------------- /android/gradlew: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | 3 | # 4 | # Copyright 2015 the original author or authors. 5 | # 6 | # Licensed under the Apache License, Version 2.0 (the "License"); 7 | # you may not use this file except in compliance with the License. 8 | # You may obtain a copy of the License at 9 | # 10 | # http://www.apache.org/licenses/LICENSE-2.0 11 | # 12 | # Unless required by applicable law or agreed to in writing, software 13 | # distributed under the License is distributed on an "AS IS" BASIS, 14 | # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 15 | # See the License for the specific language governing permissions and 16 | # limitations under the License. 17 | # 18 | 19 | ############################################################################## 20 | ## 21 | ## Gradle start up script for UN*X 22 | ## 23 | ############################################################################## 24 | 25 | # Attempt to set APP_HOME 26 | # Resolve links: $0 may be a link 27 | PRG="$0" 28 | # Need this for relative symlinks. 29 | while [ -h "$PRG" ] ; do 30 | ls=`ls -ld "$PRG"` 31 | link=`expr "$ls" : '.*-> \(.*\)$'` 32 | if expr "$link" : '/.*' > /dev/null; then 33 | PRG="$link" 34 | else 35 | PRG=`dirname "$PRG"`"/$link" 36 | fi 37 | done 38 | SAVED="`pwd`" 39 | cd "`dirname \"$PRG\"`/" >/dev/null 40 | APP_HOME="`pwd -P`" 41 | cd "$SAVED" >/dev/null 42 | 43 | APP_NAME="Gradle" 44 | APP_BASE_NAME=`basename "$0"` 45 | 46 | # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 47 | DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"' 48 | 49 | # Use the maximum available, or set MAX_FD != -1 to use that value. 50 | MAX_FD="maximum" 51 | 52 | warn () { 53 | echo "$*" 54 | } 55 | 56 | die () { 57 | echo 58 | echo "$*" 59 | echo 60 | exit 1 61 | } 62 | 63 | # OS specific support (must be 'true' or 'false'). 64 | cygwin=false 65 | msys=false 66 | darwin=false 67 | nonstop=false 68 | case "`uname`" in 69 | CYGWIN* ) 70 | cygwin=true 71 | ;; 72 | Darwin* ) 73 | darwin=true 74 | ;; 75 | MINGW* ) 76 | msys=true 77 | ;; 78 | NONSTOP* ) 79 | nonstop=true 80 | ;; 81 | esac 82 | 83 | CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar 84 | 85 | # Determine the Java command to use to start the JVM. 86 | if [ -n "$JAVA_HOME" ] ; then 87 | if [ -x "$JAVA_HOME/jre/sh/java" ] ; then 88 | # IBM's JDK on AIX uses strange locations for the executables 89 | JAVACMD="$JAVA_HOME/jre/sh/java" 90 | else 91 | JAVACMD="$JAVA_HOME/bin/java" 92 | fi 93 | if [ ! -x "$JAVACMD" ] ; then 94 | die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME 95 | 96 | Please set the JAVA_HOME variable in your environment to match the 97 | location of your Java installation." 98 | fi 99 | else 100 | JAVACMD="java" 101 | which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 102 | 103 | Please set the JAVA_HOME variable in your environment to match the 104 | location of your Java installation." 105 | fi 106 | 107 | # Increase the maximum file descriptors if we can. 108 | if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then 109 | MAX_FD_LIMIT=`ulimit -H -n` 110 | if [ $? -eq 0 ] ; then 111 | if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then 112 | MAX_FD="$MAX_FD_LIMIT" 113 | fi 114 | ulimit -n $MAX_FD 115 | if [ $? -ne 0 ] ; then 116 | warn "Could not set maximum file descriptor limit: $MAX_FD" 117 | fi 118 | else 119 | warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT" 120 | fi 121 | fi 122 | 123 | # For Darwin, add options to specify how the application appears in the dock 124 | if $darwin; then 125 | GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\"" 126 | fi 127 | 128 | # For Cygwin, switch paths to Windows format before running java 129 | if $cygwin ; then 130 | APP_HOME=`cygpath --path --mixed "$APP_HOME"` 131 | CLASSPATH=`cygpath --path --mixed "$CLASSPATH"` 132 | JAVACMD=`cygpath --unix "$JAVACMD"` 133 | 134 | # We build the pattern for arguments to be converted via cygpath 135 | ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null` 136 | SEP="" 137 | for dir in $ROOTDIRSRAW ; do 138 | ROOTDIRS="$ROOTDIRS$SEP$dir" 139 | SEP="|" 140 | done 141 | OURCYGPATTERN="(^($ROOTDIRS))" 142 | # Add a user-defined pattern to the cygpath arguments 143 | if [ "$GRADLE_CYGPATTERN" != "" ] ; then 144 | OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)" 145 | fi 146 | # Now convert the arguments - kludge to limit ourselves to /bin/sh 147 | i=0 148 | for arg in "$@" ; do 149 | CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -` 150 | CHECK2=`echo "$arg"|egrep -c "^-"` ### Determine if an option 151 | 152 | if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then ### Added a condition 153 | eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"` 154 | else 155 | eval `echo args$i`="\"$arg\"" 156 | fi 157 | i=$((i+1)) 158 | done 159 | case $i in 160 | (0) set -- ;; 161 | (1) set -- "$args0" ;; 162 | (2) set -- "$args0" "$args1" ;; 163 | (3) set -- "$args0" "$args1" "$args2" ;; 164 | (4) set -- "$args0" "$args1" "$args2" "$args3" ;; 165 | (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;; 166 | (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;; 167 | (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;; 168 | (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;; 169 | (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;; 170 | esac 171 | fi 172 | 173 | # Escape application args 174 | save () { 175 | for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done 176 | echo " " 177 | } 178 | APP_ARGS=$(save "$@") 179 | 180 | # Collect all arguments for the java command, following the shell quoting and substitution rules 181 | eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS" 182 | 183 | # by default we should be in the correct project dir, but when run from Finder on Mac, the cwd is wrong 184 | if [ "$(uname)" = "Darwin" ] && [ "$HOME" = "$PWD" ]; then 185 | cd "$(dirname "$0")" 186 | fi 187 | 188 | exec "$JAVACMD" "$@" 189 | -------------------------------------------------------------------------------- /android/gradlew.bat: -------------------------------------------------------------------------------- 1 | @rem 2 | @rem Copyright 2015 the original author or authors. 3 | @rem 4 | @rem Licensed under the Apache License, Version 2.0 (the "License"); 5 | @rem you may not use this file except in compliance with the License. 6 | @rem You may obtain a copy of the License at 7 | @rem 8 | @rem http://www.apache.org/licenses/LICENSE-2.0 9 | @rem 10 | @rem Unless required by applicable law or agreed to in writing, software 11 | @rem distributed under the License is distributed on an "AS IS" BASIS, 12 | @rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 13 | @rem See the License for the specific language governing permissions and 14 | @rem limitations under the License. 15 | @rem 16 | 17 | @if "%DEBUG%" == "" @echo off 18 | @rem ########################################################################## 19 | @rem 20 | @rem Gradle startup script for Windows 21 | @rem 22 | @rem ########################################################################## 23 | 24 | @rem Set local scope for the variables with windows NT shell 25 | if "%OS%"=="Windows_NT" setlocal 26 | 27 | set DIRNAME=%~dp0 28 | if "%DIRNAME%" == "" set DIRNAME=. 29 | set APP_BASE_NAME=%~n0 30 | set APP_HOME=%DIRNAME% 31 | 32 | @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 33 | set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m" 34 | 35 | @rem Find java.exe 36 | if defined JAVA_HOME goto findJavaFromJavaHome 37 | 38 | set JAVA_EXE=java.exe 39 | %JAVA_EXE% -version >NUL 2>&1 40 | if "%ERRORLEVEL%" == "0" goto init 41 | 42 | echo. 43 | echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 44 | echo. 45 | echo Please set the JAVA_HOME variable in your environment to match the 46 | echo location of your Java installation. 47 | 48 | goto fail 49 | 50 | :findJavaFromJavaHome 51 | set JAVA_HOME=%JAVA_HOME:"=% 52 | set JAVA_EXE=%JAVA_HOME%/bin/java.exe 53 | 54 | if exist "%JAVA_EXE%" goto init 55 | 56 | echo. 57 | echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 58 | echo. 59 | echo Please set the JAVA_HOME variable in your environment to match the 60 | echo location of your Java installation. 61 | 62 | goto fail 63 | 64 | :init 65 | @rem Get command-line arguments, handling Windows variants 66 | 67 | if not "%OS%" == "Windows_NT" goto win9xME_args 68 | 69 | :win9xME_args 70 | @rem Slurp the command line arguments. 71 | set CMD_LINE_ARGS= 72 | set _SKIP=2 73 | 74 | :win9xME_args_slurp 75 | if "x%~1" == "x" goto execute 76 | 77 | set CMD_LINE_ARGS=%* 78 | 79 | :execute 80 | @rem Setup the command line 81 | 82 | set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar 83 | 84 | @rem Execute Gradle 85 | "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS% 86 | 87 | :end 88 | @rem End local scope for the variables with windows NT shell 89 | if "%ERRORLEVEL%"=="0" goto mainEnd 90 | 91 | :fail 92 | rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of 93 | rem the _cmd.exe /c_ return code! 94 | if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 95 | exit /b 1 96 | 97 | :mainEnd 98 | if "%OS%"=="Windows_NT" endlocal 99 | 100 | :omega 101 | -------------------------------------------------------------------------------- /android/settings.gradle: -------------------------------------------------------------------------------- 1 | rootProject.name = 'react_blibli' 2 | apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings) 3 | include ':app' 4 | -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react_blibli", 3 | "displayName": "react_blibli" 4 | } -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: ['module:metro-react-native-babel-preset'], 3 | }; 4 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @format 3 | */ 4 | 5 | import {AppRegistry} from 'react-native'; 6 | // import App from './App'; 7 | import App from './router'; 8 | // import App from './Main' 9 | import {name as AppName} from './app.json'; 10 | 11 | 12 | 13 | AppRegistry.registerComponent(AppName, () => App); 14 | -------------------------------------------------------------------------------- /ios/Podfile: -------------------------------------------------------------------------------- 1 | platform :ios, '9.0' 2 | require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules' 3 | 4 | target 'react_blibli' do 5 | # Pods for react_blibli 6 | pod 'FBLazyVector', :path => "../node_modules/react-native/Libraries/FBLazyVector" 7 | pod 'FBReactNativeSpec', :path => "../node_modules/react-native/Libraries/FBReactNativeSpec" 8 | pod 'RCTRequired', :path => "../node_modules/react-native/Libraries/RCTRequired" 9 | pod 'RCTTypeSafety', :path => "../node_modules/react-native/Libraries/TypeSafety" 10 | pod 'React', :path => '../node_modules/react-native/' 11 | pod 'React-Core', :path => '../node_modules/react-native/' 12 | pod 'React-CoreModules', :path => '../node_modules/react-native/React/CoreModules' 13 | pod 'React-Core/DevSupport', :path => '../node_modules/react-native/' 14 | pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS' 15 | pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation' 16 | pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob' 17 | pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image' 18 | pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS' 19 | pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network' 20 | pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings' 21 | pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text' 22 | pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration' 23 | pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native/' 24 | 25 | pod 'React-cxxreact', :path => '../node_modules/react-native/ReactCommon/cxxreact' 26 | pod 'React-jsi', :path => '../node_modules/react-native/ReactCommon/jsi' 27 | pod 'React-jsiexecutor', :path => '../node_modules/react-native/ReactCommon/jsiexecutor' 28 | pod 'React-jsinspector', :path => '../node_modules/react-native/ReactCommon/jsinspector' 29 | pod 'ReactCommon/jscallinvoker', :path => "../node_modules/react-native/ReactCommon" 30 | pod 'ReactCommon/turbomodule/core', :path => "../node_modules/react-native/ReactCommon" 31 | pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga' 32 | 33 | pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec' 34 | pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec' 35 | pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec' 36 | 37 | target 'react_blibliTests' do 38 | inherit! :search_paths 39 | # Pods for testing 40 | end 41 | 42 | use_native_modules! 43 | end 44 | 45 | target 'react_blibli-tvOS' do 46 | # Pods for react_blibli-tvOS 47 | 48 | target 'react_blibli-tvOSTests' do 49 | inherit! :search_paths 50 | # Pods for testing 51 | end 52 | 53 | end 54 | -------------------------------------------------------------------------------- /ios/react_blibli-tvOS/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | APPL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | LSRequiresIPhoneOS 24 | 25 | NSAppTransportSecurity 26 | 27 | NSExceptionDomains 28 | 29 | localhost 30 | 31 | NSExceptionAllowsInsecureHTTPLoads 32 | 33 | 34 | 35 | 36 | NSLocationWhenInUseUsageDescription 37 | 38 | UILaunchStoryboardName 39 | LaunchScreen 40 | UIRequiredDeviceCapabilities 41 | 42 | armv7 43 | 44 | UISupportedInterfaceOrientations 45 | 46 | UIInterfaceOrientationPortrait 47 | UIInterfaceOrientationLandscapeLeft 48 | UIInterfaceOrientationLandscapeRight 49 | 50 | UIViewControllerBasedStatusBarAppearance 51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /ios/react_blibli-tvOSTests/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | BNDL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | 24 | 25 | -------------------------------------------------------------------------------- /ios/react_blibli.xcodeproj/xcshareddata/xcschemes/react_blibli-tvOS.xcscheme: -------------------------------------------------------------------------------- 1 | 2 | 5 | 8 | 9 | 15 | 21 | 22 | 23 | 29 | 35 | 36 | 37 | 43 | 49 | 50 | 51 | 52 | 53 | 58 | 59 | 61 | 67 | 68 | 69 | 70 | 71 | 77 | 78 | 79 | 80 | 81 | 82 | 92 | 94 | 100 | 101 | 102 | 103 | 104 | 105 | 111 | 113 | 119 | 120 | 121 | 122 | 124 | 125 | 128 | 129 | 130 | -------------------------------------------------------------------------------- /ios/react_blibli.xcodeproj/xcshareddata/xcschemes/react_blibli.xcscheme: -------------------------------------------------------------------------------- 1 | 2 | 5 | 8 | 9 | 15 | 21 | 22 | 23 | 29 | 35 | 36 | 37 | 43 | 49 | 50 | 51 | 52 | 53 | 58 | 59 | 61 | 67 | 68 | 69 | 70 | 71 | 77 | 78 | 79 | 80 | 81 | 82 | 92 | 94 | 100 | 101 | 102 | 103 | 104 | 105 | 111 | 113 | 119 | 120 | 121 | 122 | 124 | 125 | 128 | 129 | 130 | -------------------------------------------------------------------------------- /ios/react_blibli/AppDelegate.h: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) Facebook, Inc. and its affiliates. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | #import 9 | #import 10 | 11 | @interface AppDelegate : UIResponder 12 | 13 | @property (nonatomic, strong) UIWindow *window; 14 | 15 | @end 16 | -------------------------------------------------------------------------------- /ios/react_blibli/AppDelegate.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) Facebook, Inc. and its affiliates. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | #import "AppDelegate.h" 9 | 10 | #import 11 | #import 12 | #import 13 | 14 | @implementation AppDelegate 15 | 16 | - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 17 | { 18 | RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions]; 19 | RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge 20 | moduleName:@"react_blibli" 21 | initialProperties:nil]; 22 | 23 | rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1]; 24 | 25 | self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds]; 26 | UIViewController *rootViewController = [UIViewController new]; 27 | rootViewController.view = rootView; 28 | self.window.rootViewController = rootViewController; 29 | [self.window makeKeyAndVisible]; 30 | return YES; 31 | } 32 | 33 | - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge 34 | { 35 | #if DEBUG 36 | return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; 37 | #else 38 | return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"]; 39 | #endif 40 | } 41 | 42 | @end 43 | -------------------------------------------------------------------------------- /ios/react_blibli/Base.lproj/LaunchScreen.xib: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 21 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /ios/react_blibli/Images.xcassets/AppIcon.appiconset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "size" : "29x29", 6 | "scale" : "2x" 7 | }, 8 | { 9 | "idiom" : "iphone", 10 | "size" : "29x29", 11 | "scale" : "3x" 12 | }, 13 | { 14 | "idiom" : "iphone", 15 | "size" : "40x40", 16 | "scale" : "2x" 17 | }, 18 | { 19 | "idiom" : "iphone", 20 | "size" : "40x40", 21 | "scale" : "3x" 22 | }, 23 | { 24 | "idiom" : "iphone", 25 | "size" : "60x60", 26 | "scale" : "2x" 27 | }, 28 | { 29 | "idiom" : "iphone", 30 | "size" : "60x60", 31 | "scale" : "3x" 32 | } 33 | ], 34 | "info" : { 35 | "version" : 1, 36 | "author" : "xcode" 37 | } 38 | } -------------------------------------------------------------------------------- /ios/react_blibli/Images.xcassets/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "info" : { 3 | "version" : 1, 4 | "author" : "xcode" 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /ios/react_blibli/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleDisplayName 8 | react_blibli 9 | CFBundleExecutable 10 | $(EXECUTABLE_NAME) 11 | CFBundleIdentifier 12 | $(PRODUCT_BUNDLE_IDENTIFIER) 13 | CFBundleInfoDictionaryVersion 14 | 6.0 15 | CFBundleName 16 | $(PRODUCT_NAME) 17 | CFBundlePackageType 18 | APPL 19 | CFBundleShortVersionString 20 | 1.0 21 | CFBundleSignature 22 | ???? 23 | CFBundleVersion 24 | 1 25 | LSRequiresIPhoneOS 26 | 27 | NSAppTransportSecurity 28 | 29 | NSAllowsArbitraryLoads 30 | 31 | NSExceptionDomains 32 | 33 | localhost 34 | 35 | NSExceptionAllowsInsecureHTTPLoads 36 | 37 | 38 | 39 | 40 | NSLocationWhenInUseUsageDescription 41 | 42 | UILaunchStoryboardName 43 | LaunchScreen 44 | UIRequiredDeviceCapabilities 45 | 46 | armv7 47 | 48 | UISupportedInterfaceOrientations 49 | 50 | UIInterfaceOrientationPortrait 51 | UIInterfaceOrientationLandscapeLeft 52 | UIInterfaceOrientationLandscapeRight 53 | 54 | UIViewControllerBasedStatusBarAppearance 55 | 56 | UIAppFonts 57 | 58 | AntDesign.ttf 59 | Entypo.ttf 60 | EvilIcons.ttf 61 | Feather.ttf 62 | FontAwesome.ttf 63 | FontAwesome5_Brands.ttf 64 | FontAwesome5_Regular.ttf 65 | FontAwesome5_Solid.ttf 66 | Fontisto.ttf 67 | Foundation.ttf 68 | Ionicons.ttf 69 | MaterialCommunityIcons.ttf 70 | MaterialIcons.ttf 71 | Octicons.ttf 72 | Roboto_medium.ttf 73 | Roboto.ttf 74 | rubicon-icon-font.ttf 75 | SimpleLineIcons.ttf 76 | Zocial.ttf 77 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /ios/react_blibli/main.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) Facebook, Inc. and its affiliates. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | #import 9 | 10 | #import "AppDelegate.h" 11 | 12 | int main(int argc, char * argv[]) { 13 | @autoreleasepool { 14 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class])); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /ios/react_blibliTests/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | BNDL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | 24 | 25 | -------------------------------------------------------------------------------- /ios/react_blibliTests/react_blibliTests.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) Facebook, Inc. and its affiliates. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | #import 9 | #import 10 | 11 | #import 12 | #import 13 | 14 | #define TIMEOUT_SECONDS 600 15 | #define TEXT_TO_LOOK_FOR @"Welcome to React" 16 | 17 | @interface react_blibliTests : XCTestCase 18 | 19 | @end 20 | 21 | @implementation react_blibliTests 22 | 23 | - (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test 24 | { 25 | if (test(view)) { 26 | return YES; 27 | } 28 | for (UIView *subview in [view subviews]) { 29 | if ([self findSubviewInView:subview matching:test]) { 30 | return YES; 31 | } 32 | } 33 | return NO; 34 | } 35 | 36 | - (void)testRendersWelcomeScreen 37 | { 38 | UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController]; 39 | NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS]; 40 | BOOL foundElement = NO; 41 | 42 | __block NSString *redboxError = nil; 43 | #ifdef DEBUG 44 | RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) { 45 | if (level >= RCTLogLevelError) { 46 | redboxError = message; 47 | } 48 | }); 49 | #endif 50 | 51 | while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) { 52 | [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]]; 53 | [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]]; 54 | 55 | foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) { 56 | if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) { 57 | return YES; 58 | } 59 | return NO; 60 | }]; 61 | } 62 | 63 | #ifdef DEBUG 64 | RCTSetLogFunction(RCTDefaultLogFunction); 65 | #endif 66 | 67 | XCTAssertNil(redboxError, @"RedBox error: %@", redboxError); 68 | XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS); 69 | } 70 | 71 | 72 | @end 73 | -------------------------------------------------------------------------------- /metro.config.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Metro configuration for React Native 3 | * https://github.com/facebook/react-native 4 | * 5 | * @format 6 | */ 7 | 8 | module.exports = { 9 | transformer: { 10 | getTransformOptions: async () => ({ 11 | transform: { 12 | experimentalImportSupport: false, 13 | inlineRequires: false, 14 | }, 15 | }), 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ReactDemo1", 3 | "version": "0.0.1", 4 | "private": true, 5 | "scripts": { 6 | "android": "react-native run-android", 7 | "ios": "react-native run-ios", 8 | "start": "react-native start", 9 | "test": "jest", 10 | "lint": "eslint ." 11 | }, 12 | "dependencies": { 13 | "native-base": "^2.13.8", 14 | "react": "16.9.0", 15 | "react-native": "0.61.5", 16 | "react-native-banner-carousel": "^1.0.3", 17 | "react-native-drawer": "^2.5.1", 18 | "react-native-router-flux": "^4.0.6", 19 | "react-native-scrollable-tab-view": "^1.0.0", 20 | "react-native-tab-navigator": "^0.3.4", 21 | "react-native-video": "^5.0.2" 22 | }, 23 | "devDependencies": { 24 | "@babel/core": "^7.7.4", 25 | "@babel/runtime": "^7.7.4", 26 | "@react-native-community/eslint-config": "^0.0.5", 27 | "babel-jest": "^24.9.0", 28 | "eslint": "^6.7.2", 29 | "jest": "^24.9.0", 30 | "metro-react-native-babel-preset": "^0.57.0", 31 | "react-test-renderer": "16.9.0" 32 | }, 33 | "jest": { 34 | "preset": "react-native" 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /router.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | // 导入路由相关的组件 3 | // Router: 就相当于 之前所学的 HashRouter 4 | // Stack: 这是一个分组的容器，他不表示具体的路由，专门用来给路由分组的 5 | // Scene：就表示一个具体的路由规则，好比之前学的 Route 6 | import { Router, Stack, Scene, Tabs } from 'react-native-router-flux' 7 | import App from './App.js' 8 | import BanMore from './src/components/BanMore.js'; 9 | 10 | 11 | class AppRouter extends Component { 12 | render() { 13 | return ( 14 | 15 | 16 | {/* hideNavBar */} 17 | 18 | 19 | 20 | ); 21 | } 22 | } 23 | 24 | export default AppRouter; 25 | 26 | -------------------------------------------------------------------------------- /src/assets/icons/font_bilibili/demo.css: -------------------------------------------------------------------------------- 1 | /* Logo 字体 */ 2 | @font-face { 3 | font-family: "iconfont logo"; 4 | src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); 5 | src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), 6 | url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), 7 | url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), 8 | url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); 9 | } 10 | 11 | .logo { 12 | font-family: "iconfont logo"; 13 | font-size: 160px; 14 | font-style: normal; 15 | -webkit-font-smoothing: antialiased; 16 | -moz-osx-font-smoothing: grayscale; 17 | } 18 | 19 | /* tabs */ 20 | .nav-tabs { 21 | position: relative; 22 | } 23 | 24 | .nav-tabs .nav-more { 25 | position: absolute; 26 | right: 0; 27 | bottom: 0; 28 | height: 42px; 29 | line-height: 42px; 30 | color: #666; 31 | } 32 | 33 | #tabs { 34 | border-bottom: 1px solid #eee; 35 | } 36 | 37 | #tabs li { 38 | cursor: pointer; 39 | width: 100px; 40 | height: 40px; 41 | line-height: 40px; 42 | text-align: center; 43 | font-size: 16px; 44 | border-bottom: 2px solid transparent; 45 | position: relative; 46 | z-index: 1; 47 | margin-bottom: -1px; 48 | color: #666; 49 | } 50 | 51 | 52 | #tabs .active { 53 | border-bottom-color: #f00; 54 | color: #222; 55 | } 56 | 57 | .tab-container .content { 58 | display: none; 59 | } 60 | 61 | /* 页面布局 */ 62 | .main { 63 | padding: 30px 100px; 64 | width: 960px; 65 | margin: 0 auto; 66 | } 67 | 68 | .main .logo { 69 | color: #333; 70 | text-align: left; 71 | margin-bottom: 30px; 72 | line-height: 1; 73 | height: 110px; 74 | margin-top: -50px; 75 | overflow: hidden; 76 | *zoom: 1; 77 | } 78 | 79 | .main .logo a { 80 | font-size: 160px; 81 | color: #333; 82 | } 83 | 84 | .helps { 85 | margin-top: 40px; 86 | } 87 | 88 | .helps pre { 89 | padding: 20px; 90 | margin: 10px 0; 91 | border: solid 1px #e7e1cd; 92 | background-color: #fffdef; 93 | overflow: auto; 94 | } 95 | 96 | .icon_lists { 97 | width: 100% !important; 98 | overflow: hidden; 99 | *zoom: 1; 100 | } 101 | 102 | .icon_lists li { 103 | width: 100px; 104 | margin-bottom: 10px; 105 | margin-right: 20px; 106 | text-align: center; 107 | list-style: none !important; 108 | cursor: default; 109 | } 110 | 111 | .icon_lists li .code-name { 112 | line-height: 1.2; 113 | } 114 | 115 | .icon_lists .icon { 116 | display: block; 117 | height: 100px; 118 | line-height: 100px; 119 | font-size: 42px; 120 | margin: 10px auto; 121 | color: #333; 122 | -webkit-transition: font-size 0.25s linear, width 0.25s linear; 123 | -moz-transition: font-size 0.25s linear, width 0.25s linear; 124 | transition: font-size 0.25s linear, width 0.25s linear; 125 | } 126 | 127 | .icon_lists .icon:hover { 128 | font-size: 100px; 129 | } 130 | 131 | .icon_lists .svg-icon { 132 | /* 通过设置 font-size 来改变图标大小 */ 133 | width: 1em; 134 | /* 图标和文字相邻时，垂直对齐 */ 135 | vertical-align: -0.15em; 136 | /* 通过设置 color 来改变 SVG 的颜色/fill */ 137 | fill: currentColor; 138 | /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 139 | normalize.css 中也包含这行 */ 140 | overflow: hidden; 141 | } 142 | 143 | .icon_lists li .name, 144 | .icon_lists li .code-name { 145 | color: #666; 146 | } 147 | 148 | /* markdown 样式 */ 149 | .markdown { 150 | color: #666; 151 | font-size: 14px; 152 | line-height: 1.8; 153 | } 154 | 155 | .highlight { 156 | line-height: 1.5; 157 | } 158 | 159 | .markdown img { 160 | vertical-align: middle; 161 | max-width: 100%; 162 | } 163 | 164 | .markdown h1 { 165 | color: #404040; 166 | font-weight: 500; 167 | line-height: 40px; 168 | margin-bottom: 24px; 169 | } 170 | 171 | .markdown h2, 172 | .markdown h3, 173 | .markdown h4, 174 | .markdown h5, 175 | .markdown h6 { 176 | color: #404040; 177 | margin: 1.6em 0 0.6em 0; 178 | font-weight: 500; 179 | clear: both; 180 | } 181 | 182 | .markdown h1 { 183 | font-size: 28px; 184 | } 185 | 186 | .markdown h2 { 187 | font-size: 22px; 188 | } 189 | 190 | .markdown h3 { 191 | font-size: 16px; 192 | } 193 | 194 | .markdown h4 { 195 | font-size: 14px; 196 | } 197 | 198 | .markdown h5 { 199 | font-size: 12px; 200 | } 201 | 202 | .markdown h6 { 203 | font-size: 12px; 204 | } 205 | 206 | .markdown hr { 207 | height: 1px; 208 | border: 0; 209 | background: #e9e9e9; 210 | margin: 16px 0; 211 | clear: both; 212 | } 213 | 214 | .markdown p { 215 | margin: 1em 0; 216 | } 217 | 218 | .markdown>p, 219 | .markdown>blockquote, 220 | .markdown>.highlight, 221 | .markdown>ol, 222 | .markdown>ul { 223 | width: 80%; 224 | } 225 | 226 | .markdown ul>li { 227 | list-style: circle; 228 | } 229 | 230 | .markdown>ul li, 231 | .markdown blockquote ul>li { 232 | margin-left: 20px; 233 | padding-left: 4px; 234 | } 235 | 236 | .markdown>ul li p, 237 | .markdown>ol li p { 238 | margin: 0.6em 0; 239 | } 240 | 241 | .markdown ol>li { 242 | list-style: decimal; 243 | } 244 | 245 | .markdown>ol li, 246 | .markdown blockquote ol>li { 247 | margin-left: 20px; 248 | padding-left: 4px; 249 | } 250 | 251 | .markdown code { 252 | margin: 0 3px; 253 | padding: 0 5px; 254 | background: #eee; 255 | border-radius: 3px; 256 | } 257 | 258 | .markdown strong, 259 | .markdown b { 260 | font-weight: 600; 261 | } 262 | 263 | .markdown>table { 264 | border-collapse: collapse; 265 | border-spacing: 0px; 266 | empty-cells: show; 267 | border: 1px solid #e9e9e9; 268 | width: 95%; 269 | margin-bottom: 24px; 270 | } 271 | 272 | .markdown>table th { 273 | white-space: nowrap; 274 | color: #333; 275 | font-weight: 600; 276 | } 277 | 278 | .markdown>table th, 279 | .markdown>table td { 280 | border: 1px solid #e9e9e9; 281 | padding: 8px 16px; 282 | text-align: left; 283 | } 284 | 285 | .markdown>table th { 286 | background: #F7F7F7; 287 | } 288 | 289 | .markdown blockquote { 290 | font-size: 90%; 291 | color: #999; 292 | border-left: 4px solid #e9e9e9; 293 | padding-left: 0.8em; 294 | margin: 1em 0; 295 | } 296 | 297 | .markdown blockquote p { 298 | margin: 0; 299 | } 300 | 301 | .markdown .anchor { 302 | opacity: 0; 303 | transition: opacity 0.3s ease; 304 | margin-left: 8px; 305 | } 306 | 307 | .markdown .waiting { 308 | color: #ccc; 309 | } 310 | 311 | .markdown h1:hover .anchor, 312 | .markdown h2:hover .anchor, 313 | .markdown h3:hover .anchor, 314 | .markdown h4:hover .anchor, 315 | .markdown h5:hover .anchor, 316 | .markdown h6:hover .anchor { 317 | opacity: 1; 318 | display: inline-block; 319 | } 320 | 321 | .markdown>br, 322 | .markdown>p>br { 323 | clear: both; 324 | } 325 | 326 | 327 | .hljs { 328 | display: block; 329 | background: white; 330 | padding: 0.5em; 331 | color: #333333; 332 | overflow-x: auto; 333 | } 334 | 335 | .hljs-comment, 336 | .hljs-meta { 337 | color: #969896; 338 | } 339 | 340 | .hljs-string, 341 | .hljs-variable, 342 | .hljs-template-variable, 343 | .hljs-strong, 344 | .hljs-emphasis, 345 | .hljs-quote { 346 | color: #df5000; 347 | } 348 | 349 | .hljs-keyword, 350 | .hljs-selector-tag, 351 | .hljs-type { 352 | color: #a71d5d; 353 | } 354 | 355 | .hljs-literal, 356 | .hljs-symbol, 357 | .hljs-bullet, 358 | .hljs-attribute { 359 | color: #0086b3; 360 | } 361 | 362 | .hljs-section, 363 | .hljs-name { 364 | color: #63a35c; 365 | } 366 | 367 | .hljs-tag { 368 | color: #333333; 369 | } 370 | 371 | .hljs-title, 372 | .hljs-attr, 373 | .hljs-selector-id, 374 | .hljs-selector-class, 375 | .hljs-selector-attr, 376 | .hljs-selector-pseudo { 377 | color: #795da3; 378 | } 379 | 380 | .hljs-addition { 381 | color: #55a532; 382 | background-color: #eaffea; 383 | } 384 | 385 | .hljs-deletion { 386 | color: #bd2c00; 387 | background-color: #ffecec; 388 | } 389 | 390 | .hljs-link { 391 | text-decoration: underline; 392 | } 393 | 394 | /* 代码高亮 */ 395 | /* PrismJS 1.15.0 396 | https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ 397 | /** 398 | * prism.js default theme for JavaScript, CSS and HTML 399 | * Based on dabblet (http://dabblet.com) 400 | * @author Lea Verou 401 | */ 402 | code[class*="language-"], 403 | pre[class*="language-"] { 404 | color: black; 405 | background: none; 406 | text-shadow: 0 1px white; 407 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 408 | text-align: left; 409 | white-space: pre; 410 | word-spacing: normal; 411 | word-break: normal; 412 | word-wrap: normal; 413 | line-height: 1.5; 414 | 415 | -moz-tab-size: 4; 416 | -o-tab-size: 4; 417 | tab-size: 4; 418 | 419 | -webkit-hyphens: none; 420 | -moz-hyphens: none; 421 | -ms-hyphens: none; 422 | hyphens: none; 423 | } 424 | 425 | pre[class*="language-"]::-moz-selection, 426 | pre[class*="language-"] ::-moz-selection, 427 | code[class*="language-"]::-moz-selection, 428 | code[class*="language-"] ::-moz-selection { 429 | text-shadow: none; 430 | background: #b3d4fc; 431 | } 432 | 433 | pre[class*="language-"]::selection, 434 | pre[class*="language-"] ::selection, 435 | code[class*="language-"]::selection, 436 | code[class*="language-"] ::selection { 437 | text-shadow: none; 438 | background: #b3d4fc; 439 | } 440 | 441 | @media print { 442 | 443 | code[class*="language-"], 444 | pre[class*="language-"] { 445 | text-shadow: none; 446 | } 447 | } 448 | 449 | /* Code blocks */ 450 | pre[class*="language-"] { 451 | padding: 1em; 452 | margin: .5em 0; 453 | overflow: auto; 454 | } 455 | 456 | :not(pre)>code[class*="language-"], 457 | pre[class*="language-"] { 458 | background: #f5f2f0; 459 | } 460 | 461 | /* Inline code */ 462 | :not(pre)>code[class*="language-"] { 463 | padding: .1em; 464 | border-radius: .3em; 465 | white-space: normal; 466 | } 467 | 468 | .token.comment, 469 | .token.prolog, 470 | .token.doctype, 471 | .token.cdata { 472 | color: slategray; 473 | } 474 | 475 | .token.punctuation { 476 | color: #999; 477 | } 478 | 479 | .namespace { 480 | opacity: .7; 481 | } 482 | 483 | .token.property, 484 | .token.tag, 485 | .token.boolean, 486 | .token.number, 487 | .token.constant, 488 | .token.symbol, 489 | .token.deleted { 490 | color: #905; 491 | } 492 | 493 | .token.selector, 494 | .token.attr-name, 495 | .token.string, 496 | .token.char, 497 | .token.builtin, 498 | .token.inserted { 499 | color: #690; 500 | } 501 | 502 | .token.operator, 503 | .token.entity, 504 | .token.url, 505 | .language-css .token.string, 506 | .style .token.string { 507 | color: #9a6e3a; 508 | background: hsla(0, 0%, 100%, .5); 509 | } 510 | 511 | .token.atrule, 512 | .token.attr-value, 513 | .token.keyword { 514 | color: #07a; 515 | } 516 | 517 | .token.function, 518 | .token.class-name { 519 | color: #DD4A68; 520 | } 521 | 522 | .token.regex, 523 | .token.important, 524 | .token.variable { 525 | color: #e90; 526 | } 527 | 528 | .token.important, 529 | .token.bold { 530 | font-weight: bold; 531 | } 532 | 533 | .token.italic { 534 | font-style: italic; 535 | } 536 | 537 | .token.entity { 538 | cursor: help; 539 | } 540 | -------------------------------------------------------------------------------- /src/assets/icons/font_bilibili/iconfont.css: -------------------------------------------------------------------------------- 1 | @font-face {font-family: "iconfont"; 2 | src: 3 | url('./iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ 4 | 5 | } 6 | 7 | .iconfont { 8 | font-family: "iconfont" !important; 9 | font-size: 16px; 10 | font-style: normal; 11 | -webkit-font-smoothing: antialiased; 12 | -moz-osx-font-smoothing: grayscale; 13 | } 14 | 15 | .icon-xie:before { 16 | content: "\e71f"; 17 | } 18 | 19 | .icon-xie1:before { 20 | content: "\e607"; 21 | } 22 | 23 | .icon-nv:before { 24 | content: "\e65e"; 25 | } 26 | 27 | .icon-nan:before { 28 | content: "\e65f"; 29 | } 30 | 31 | .icon-zhongxing:before { 32 | content: "\e660"; 33 | } 34 | 35 | .icon-shouyeweixuanzhong:before { 36 | content: "\e661"; 37 | } 38 | 39 | .icon-shouyexuanzhong:before { 40 | content: "\e662"; 41 | } 42 | 43 | .icon-fenquxuanzhong:before { 44 | content: "\e663"; 45 | } 46 | 47 | .icon-fenquweixuanzhong:before { 48 | content: "\e664"; 49 | } 50 | 51 | .icon-dongtaixuanzhong:before { 52 | content: "\e665"; 53 | } 54 | 55 | .icon-dongtaiweixuanzhong:before { 56 | content: "\e666"; 57 | } 58 | 59 | .icon-wodeweixuanzhong:before { 60 | content: "\e667"; 61 | } 62 | 63 | .icon-wodexuanzhong:before { 64 | content: "\e668"; 65 | } 66 | 67 | .icon-faxianweixuanzhongxuanzhong:before { 68 | content: "\e669"; 69 | } 70 | 71 | .icon-danmushu:before { 72 | content: "\e66a"; 73 | } 74 | 75 | .icon-zhuifanshu:before { 76 | content: "\e66b"; 77 | } 78 | 79 | .icon-zhiboguankanshu:before { 80 | content: "\e66c"; 81 | } 82 | 83 | .icon-bofangshu:before { 84 | content: "\e66d"; 85 | } 86 | 87 | .icon-UPzhu:before { 88 | content: "\e66e"; 89 | } 90 | 91 | .icon-shipindaxiao:before { 92 | content: "\e66f"; 93 | } 94 | 95 | .icon-Bbi:before { 96 | content: "\e670"; 97 | } 98 | 99 | .icon-fenxiang:before { 100 | content: "\e671"; 101 | } 102 | 103 | .icon-xiazai:before { 104 | content: "\e672"; 105 | } 106 | 107 | .icon-shoucang:before { 108 | content: "\e673"; 109 | } 110 | 111 | .icon-shoucangtianchong:before { 112 | content: "\e674"; 113 | } 114 | 115 | .icon-suijibofang:before { 116 | content: "\e675"; 117 | } 118 | 119 | .icon-xunhuanbofang:before { 120 | content: "\e676"; 121 | } 122 | 123 | .icon-danquxunhuan:before { 124 | content: "\e677"; 125 | } 126 | 127 | .icon-quanping:before { 128 | content: "\e678"; 129 | } 130 | 131 | .icon-sousuo:before { 132 | content: "\e679"; 133 | } 134 | 135 | .icon-shaixuan:before { 136 | content: "\e67a"; 137 | } 138 | 139 | .icon-lishijilu:before { 140 | content: "\e67b"; 141 | } 142 | 143 | .icon-shoucangjia:before { 144 | content: "\e67c"; 145 | } 146 | 147 | .icon-shaixuanpaixu:before { 148 | content: "\e67d"; 149 | } 150 | 151 | .icon-tianjia:before { 152 | content: "\e67e"; 153 | } 154 | 155 | .icon-shuayishua:before { 156 | content: "\e67f"; 157 | } 158 | 159 | .icon-diandiandianshu:before { 160 | content: "\e680"; 161 | } 162 | 163 | .icon-chexiao:before { 164 | content: "\e681"; 165 | } 166 | 167 | .icon-guanbixiao:before { 168 | content: "\e682"; 169 | } 170 | 171 | .icon-guanbi:before { 172 | content: "\e683"; 173 | } 174 | 175 | .icon-guanbida:before { 176 | content: "\e684"; 177 | } 178 | 179 | .icon-shezhi:before { 180 | content: "\e685"; 181 | } 182 | 183 | .icon-zidingyitoutu:before { 184 | content: "\e686"; 185 | } 186 | 187 | .icon-biaoqian:before { 188 | content: "\e687"; 189 | } 190 | 191 | .icon-shouye-biaoqian:before { 192 | content: "\e688"; 193 | } 194 | 195 | .icon-yijianyichu:before { 196 | content: "\e689"; 197 | } 198 | 199 | .icon-guanlishipin:before { 200 | content: "\e68a"; 201 | } 202 | 203 | .icon-shaohouguankan:before { 204 | content: "\e68b"; 205 | } 206 | 207 | .icon-shiyongxiaochuangbofang:before { 208 | content: "\e68c"; 209 | } 210 | 211 | .icon-gaojiantousu:before { 212 | content: "\e68d"; 213 | } 214 | 215 | .icon-buganxingqu:before { 216 | content: "\e68e"; 217 | } 218 | 219 | .icon-buganxingqutianchong:before { 220 | content: "\e68f"; 221 | } 222 | 223 | .icon-saoyisao:before { 224 | content: "\e690"; 225 | } 226 | 227 | .icon-shanchu:before { 228 | content: "\e691"; 229 | } 230 | 231 | .icon-fanhui:before { 232 | content: "\e692"; 233 | } 234 | 235 | .icon-gengduo:before { 236 | content: "\e693"; 237 | } 238 | 239 | .icon-xialada:before { 240 | content: "\e694"; 241 | } 242 | 243 | .icon-shouqida:before { 244 | content: "\e695"; 245 | } 246 | 247 | .icon-fanhuitianchong:before { 248 | content: "\e696"; 249 | } 250 | 251 | .icon-gengduotianchong:before { 252 | content: "\e697"; 253 | } 254 | 255 | .icon-xialatianchong:before { 256 | content: "\e698"; 257 | } 258 | 259 | .icon-shouqitianchong:before { 260 | content: "\e699"; 261 | } 262 | 263 | .icon-xialaxiao:before { 264 | content: "\e69a"; 265 | } 266 | 267 | .icon-shouqixiao:before { 268 | content: "\e69b"; 269 | } 270 | 271 | .icon-bofangqi-danmuguan:before { 272 | content: "\e69c"; 273 | } 274 | 275 | .icon-bofangqi-danmukai:before { 276 | content: "\e69d"; 277 | } 278 | 279 | .icon-bofangqi-xuanji:before { 280 | content: "\e69e"; 281 | } 282 | 283 | .icon-bofangqi-suoping:before { 284 | content: "\e69f"; 285 | } 286 | 287 | .icon-bofangqi-danmudingbuguan:before { 288 | content: "\e6a0"; 289 | } 290 | 291 | .icon-bofangqi-danmudingbukai:before { 292 | content: "\e6a1"; 293 | } 294 | 295 | .icon-bofangqi-danmudibuguan:before { 296 | content: "\e6a2"; 297 | } 298 | 299 | .icon-bofangqi-danmudibukai:before { 300 | content: "\e6a3"; 301 | } 302 | 303 | .icon-bofangqi-danmugundongguan:before { 304 | content: "\e6a4"; 305 | } 306 | 307 | .icon-bofangqi-danmugundongkai:before { 308 | content: "\e6a5"; 309 | } 310 | 311 | .icon-bofangqi-danmucaiseguan:before { 312 | content: "\e6a6"; 313 | } 314 | 315 | .icon-bofangqi-danmucaisekai:before { 316 | content: "\e6a7"; 317 | } 318 | 319 | .icon-bofangqi-danmuzitida:before { 320 | content: "\e6a8"; 321 | } 322 | 323 | .icon-bofangqi-danmuzitixiao:before { 324 | content: "\e6a9"; 325 | } 326 | 327 | .icon-bofangqi-bofang:before { 328 | content: "\e6aa"; 329 | } 330 | 331 | .icon-bofangqi-zanting:before { 332 | content: "\e6ab"; 333 | } 334 | 335 | .icon-bofangqi-xiayiji:before { 336 | content: "\e6ac"; 337 | } 338 | 339 | .icon-bofangqi-AirPlay:before { 340 | content: "\e6ad"; 341 | } 342 | 343 | .icon-bofangqi-houtaibofang:before { 344 | content: "\e6ae"; 345 | } 346 | 347 | .icon-bofangqi-jingxiangfanzhuan:before { 348 | content: "\e6af"; 349 | } 350 | 351 | .icon-bofangqi-bofangxiaodianshi:before { 352 | content: "\e6b0"; 353 | } 354 | 355 | .icon-bofangqi-zantingxiaodianshi:before { 356 | content: "\e6b1"; 357 | } 358 | 359 | .icon-paihangbang:before { 360 | content: "\e6b2"; 361 | } 362 | 363 | .icon-xiazaiwancheng:before { 364 | content: "\e6b3"; 365 | } 366 | 367 | .icon-xiazaishibai:before { 368 | content: "\e6b4"; 369 | } 370 | 371 | .icon-xiazaizhong:before { 372 | content: "\e6b5"; 373 | } 374 | 375 | .icon-bilibili:before { 376 | content: "\e6b6"; 377 | } 378 | 379 | .icon-jiaoliuxuanzhong:before { 380 | content: "\e6b7"; 381 | } 382 | 383 | .icon-jiaoliuweixuanzhong:before { 384 | content: "\e6b8"; 385 | } 386 | 387 | .icon-sixin:before { 388 | content: "\e6b9"; 389 | } 390 | 391 | .icon-lishijilu1:before { 392 | content: "\e6ba"; 393 | } 394 | 395 | .icon-xiazaihuancun:before { 396 | content: "\e6bb"; 397 | } 398 | 399 | .icon-wodeguanzhu:before { 400 | content: "\e6bc"; 401 | } 402 | 403 | .icon-chuangzuozhongxin:before { 404 | content: "\e6bd"; 405 | } 406 | 407 | .icon-mianliuliangfuwu:before { 408 | content: "\e6be"; 409 | } 410 | 411 | .icon-BMLdingdan:before { 412 | content: "\e6bf"; 413 | } 414 | 415 | .icon-shezhi1:before { 416 | content: "\e6c0"; 417 | } 418 | 419 | .icon-shaohouzaikan:before { 420 | content: "\e6c1"; 421 | } 422 | 423 | .icon-yejianmoshi:before { 424 | content: "\e6c2"; 425 | } 426 | 427 | .icon-zhuti:before { 428 | content: "\e6c3"; 429 | } 430 | 431 | .icon-wodedahuiyuan:before { 432 | content: "\e6c4"; 433 | } 434 | 435 | .icon-qianbao:before { 436 | content: "\e6c5"; 437 | } 438 | 439 | .icon-cai:before { 440 | content: "\e6c6"; 441 | } 442 | 443 | .icon-zan:before { 444 | content: "\e6c7"; 445 | } 446 | 447 | .icon-rijianmoshi:before { 448 | content: "\e6c8"; 449 | } 450 | 451 | .icon-jiazaishibaitidaiicon:before { 452 | content: "\e6c9"; 453 | } 454 | 455 | .icon-shouye:before { 456 | content: "\e6ca"; 457 | } 458 | 459 | .icon-wodeshoucang:before { 460 | content: "\e6cb"; 461 | } 462 | 463 | .icon-ic_userlevel_:before { 464 | content: "\e6cc"; 465 | } 466 | 467 | .icon-ic_userlevel_1:before { 468 | content: "\e6cd"; 469 | } 470 | 471 | .icon-ic_userlevel_2:before { 472 | content: "\e6ce"; 473 | } 474 | 475 | .icon-ic_userlevel_3:before { 476 | content: "\e6cf"; 477 | } 478 | 479 | .icon-ic_userlevel_4:before { 480 | content: "\e6d0"; 481 | } 482 | 483 | .icon-ic_userlevel_5:before { 484 | content: "\e6d1"; 485 | } 486 | 487 | .icon-ic_userlevel_6:before { 488 | content: "\e6d2"; 489 | } 490 | 491 | .icon-erweima:before { 492 | content: "\e6d3"; 493 | } 494 | 495 | .icon-qianbao1:before { 496 | content: "\e6d4"; 497 | } 498 | 499 | .icon-yizhuifan:before { 500 | content: "\e6db"; 501 | } 502 | 503 | .icon-quxiaoguanzhu:before { 504 | content: "\e6dc"; 505 | } 506 | 507 | .icon-tousu:before { 508 | content: "\e6dd"; 509 | } 510 | 511 | .icon-_ico_emoji:before { 512 | content: "\e6de"; 513 | } 514 | 515 | .icon-_ico_reply:before { 516 | content: "\e6df"; 517 | } 518 | 519 | .icon-_ico_backtokb:before { 520 | content: "\e6e0"; 521 | } 522 | 523 | .icon-xiankuangjiazaishibaidaitiicon:before { 524 | content: "\e6e1"; 525 | } 526 | 527 | .icon-gouwuche:before { 528 | content: "\e62f"; 529 | } 530 | 531 | .icon-gouwuche1:before { 532 | content: "\e606"; 533 | } 534 | 535 | .icon-xie2:before { 536 | content: "\e61e"; 537 | } 538 | 539 | .icon-gouwu:before { 540 | content: "\e601"; 541 | } 542 | 543 | -------------------------------------------------------------------------------- /src/assets/icons/font_bilibili/iconfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/icons/font_bilibili/iconfont.eot -------------------------------------------------------------------------------- /src/assets/icons/font_bilibili/iconfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/icons/font_bilibili/iconfont.ttf -------------------------------------------------------------------------------- /src/assets/icons/font_bilibili/iconfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/icons/font_bilibili/iconfont.woff -------------------------------------------------------------------------------- /src/assets/icons/font_bilibili/iconfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/icons/font_bilibili/iconfont.woff2 -------------------------------------------------------------------------------- /src/assets/images/QR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/QR.png -------------------------------------------------------------------------------- /src/assets/images/bangumi_home_login_guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/bangumi_home_login_guide.png -------------------------------------------------------------------------------- /src/assets/images/bili_default_avatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/bili_default_avatar.png -------------------------------------------------------------------------------- /src/assets/images/dynamic_login_guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/dynamic_login_guide.png -------------------------------------------------------------------------------- /src/assets/images/fengmian1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/fengmian1.jpg -------------------------------------------------------------------------------- /src/assets/images/fengmian2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/fengmian2.jpg -------------------------------------------------------------------------------- /src/assets/images/fengmian3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/fengmian3.jpg -------------------------------------------------------------------------------- /src/assets/images/head_icon.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/head_icon.jpg -------------------------------------------------------------------------------- /src/assets/images/ic_empty.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_empty.png -------------------------------------------------------------------------------- /src/assets/images/ic_loading.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_loading.png -------------------------------------------------------------------------------- /src/assets/images/ic_loading_error.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_loading_error.png -------------------------------------------------------------------------------- /src/assets/images/ic_null.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_null.png -------------------------------------------------------------------------------- /src/assets/images/ic_player_coin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_player_coin.png -------------------------------------------------------------------------------- /src/assets/images/ic_player_danmaku_input_options_rl_disabled.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_player_danmaku_input_options_rl_disabled.png -------------------------------------------------------------------------------- /src/assets/images/ic_tv_play.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_tv_play.png -------------------------------------------------------------------------------- /src/assets/images/ic_tv_play_large.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/ic_tv_play_large.png -------------------------------------------------------------------------------- /src/assets/images/img_tips_error_load_error.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/img_tips_error_load_error.png -------------------------------------------------------------------------------- /src/assets/images/live_background.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/live_background.png -------------------------------------------------------------------------------- /src/assets/images/login_logo_account.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/login_logo_account.png -------------------------------------------------------------------------------- /src/assets/images/login_logo_password.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/login_logo_password.png -------------------------------------------------------------------------------- /src/assets/images/me_tv_sign_in.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/me_tv_sign_in.png -------------------------------------------------------------------------------- /src/assets/images/me_tv_sign_out.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/me_tv_sign_out.png -------------------------------------------------------------------------------- /src/assets/images/partitions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/partitions.png -------------------------------------------------------------------------------- /src/assets/images/splashpage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/splashpage.jpg -------------------------------------------------------------------------------- /src/assets/images/timg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/timg.gif -------------------------------------------------------------------------------- /src/assets/images/小电视.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sunying128/React-Native-bilibili/abc90e4a3a32fe32b4443694d40d5b7747da47d4/src/assets/images/小电视.png -------------------------------------------------------------------------------- /src/components/BanItem.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView} from 'react-native'; 3 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 4 | import { Actions } from 'react-native-router-flux' 5 | 6 | const BannerWidth = (Dimensions.get('window').width * 0.96); 7 | const screenLeft = (Dimensions.get('window').width * 0.02); 8 | 9 | //卡片图片资源 10 | const cards = [ 11 | { 12 | id:1, 13 | active:false, 14 | name: "猎兽神兵", 15 | number: "全12话", 16 | count: "69.1万追番", 17 | imageurl: "http://i0.hdslb.com/bfs/archive/81385f895a48a1c27a0e701218781908fb9d5dd2.jpg", 18 | }, 19 | { 20 | id:1, 21 | active:false, 22 | name: "鬼灭之刃", 23 | number: "更新至第24话", 24 | count: "476.9万追番", 25 | imageurl: "http://i0.hdslb.com/bfs/archive/efc989798673c8c374cad6e2b4fc555a8f0f3c2c.jpg", 26 | }, 27 | { 28 | id:1, 29 | active:false, 30 | name: "女高中生的虚度日常", 31 | number: "更新至第11话", 32 | count: "171.1万追番", 33 | imageurl: "http://i0.hdslb.com/bfs/archive/1c277223735cfe18a32f8130855a20c1a699f706.jpg", 34 | }, 35 | { 36 | id:1, 37 | active:false, 38 | name: "某科学的一方通行", 39 | number: "更新至第10话", 40 | count: "217.2万追番", 41 | imageurl: "http://i0.hdslb.com/bfs/archive/def29a30113e96248830b2a984c8feb6749252f4.jpg", 42 | }, 43 | { 44 | id:2, 45 | active:false, 46 | name: "爱书的下克上：为了成为图书管理员不择手段！", 47 | number: "更新至第10话", 48 | count: "36万追番", 49 | imageurl: "https://i2.hdslb.com/bfs/archive/b6e413bef190422a10f6c5da448b29bafc272509.jpg", 50 | }, 51 | { 52 | id:2, 53 | active:false, 54 | name: "喜欢本大爷的竟然就你一个？", 55 | number: "更新至第9.5话", 56 | count: "159.9万追番", 57 | imageurl: "https://i0.hdslb.com/bfs/archive/6a40cf23518888c0aa5346ba9ca659771463d2df.jpg", 58 | }, 59 | { 60 | id:2, 61 | active:false, 62 | name: "碧蓝航线", 63 | number: "更新至第9话", 64 | count: "116.8万追番", 65 | imageurl: "https://i1.hdslb.com/bfs/archive/ba2cb324e57b917e2bd46794540203ff76a7ba52.jpg", 66 | }, 67 | { 68 | id:2, 69 | active:false, 70 | name: "刺客守则", 71 | number: "全12话", 72 | count: "114.6万追番", 73 | imageurl: "https://i0.hdslb.com/bfs/archive/e7a0b9d006fe345dabd0fffe45e636a27bba7be9.jpg", 74 | } 75 | 76 | ]; 77 | 78 | class BanItem extends Component { 79 | constructor(props) { 80 | super(props) 81 | this.state = { 82 | flag:true, 83 | // active:false 84 | } 85 | } 86 | 87 | handleClick=()=>{ 88 | this.setState({flag:!this.state.flag}) 89 | } 90 | 91 | 92 | render() { 93 | return ( 94 | 95 | 96 | 97 | 番剧推荐 98 | 99 | 100 | 103 | 104 | 105 | 106 | { 107 | cards.map((item,index)=>{ 108 | if(this.state.flag && item.id==1){ 109 | return ( 110 | 111 | 112 | 117 | 118 | 会员抢先 119 | 120 | {item.count} 121 | 122 | 123 | {item.name} 124 | {item.number} 125 | 126 | )} 127 | else if(!this.state.flag && item.id==2){ 128 | return ( 129 | 130 | 131 | 132 | 133 | 会员抢先 134 | 135 | {item.count} 136 | 137 | 138 | {item.name} 139 | {item.number} 140 | 141 | )} 142 | }) 143 | } 144 | 145 | 146 | 151 | 152 | 153 | ) 154 | } 155 | 156 | } 157 | 158 | const styles = StyleSheet.create({ 159 | //番剧卡片 160 | fanju: { 161 | width: BannerWidth, 162 | height: 375, 163 | marginLeft: screenLeft, 164 | overflow: "hidden", 165 | marginTop: 15, 166 | flex: 1, 167 | // 横向 居中 168 | flexDirection: 'row', 169 | position: "relative", 170 | borderBottomWidth: 0.5, 171 | borderBottomColor: "#DCDCDC", 172 | }, 173 | //番剧卡片标题 174 | fanjutitle: { 175 | width: "100%", 176 | height: 30, 177 | flex: 1, 178 | flexDirection: 'row', 179 | fontSize: 5, 180 | fontWeight: "normal" 181 | 182 | }, 183 | //番剧卡片的中间四个小卡片 184 | fanjucards: { 185 | width: "100%", 186 | height: 310, 187 | position: "absolute", 188 | top: 30, 189 | left: 0, 190 | right: 0, 191 | borderRadius: 5, 192 | overflow: "hidden", 193 | flex: 1, 194 | flexDirection: "row", 195 | flexWrap: "wrap", 196 | justifyContent: "space-between", 197 | alignContent: "space-between", 198 | 199 | }, 200 | //一个小卡片 201 | fanjucard: { 202 | width: "48%", 203 | height: 150, 204 | borderRadius: 5, 205 | overflow: "hidden", 206 | }, 207 | //浮在卡片上一层的样式 208 | surface: { 209 | width: "100%", 210 | height: 110, 211 | position: "absolute", 212 | top: 0, 213 | left: 0, 214 | zIndex: 100 215 | }, 216 | //左上角 心 217 | surfaceicon: { 218 | width: 30, 219 | height: 25, 220 | fontSize: 22, 221 | borderBottomRightRadius: 5, 222 | textAlign: "center", 223 | lineHeight: 24, 224 | // 设置背景颜色时同时设置透明度 防止背景颜色影响字体颜色 225 | color: "white", 226 | backgroundColor: 'rgba(0, 0, 0, 0.4)', 227 | marginLeft:0 228 | }, 229 | surfaceicon2: { 230 | width: 30, 231 | height: 25, 232 | fontSize: 22, 233 | borderBottomRightRadius: 5, 234 | textAlign: "center", 235 | lineHeight: 24, 236 | // 设置背景颜色时同时设置透明度 防止背景颜色影响字体颜色 237 | color: "#fb7b9e", 238 | backgroundColor: 'rgba(0, 0, 0, 0.4)', 239 | marginLeft:0 240 | }, 241 | 242 | }) 243 | 244 | 245 | 246 | 247 | export default BanItem; -------------------------------------------------------------------------------- /src/components/BanMore.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { StyleSheet, Image, View, Text, Dimensions, FlatList, ScrollView, TouchableHighlight } from 'react-native'; 3 | import { Container, Header,Title, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 4 | import { Actions } from 'react-native-router-flux'; 5 | 6 | const BannerWidth = (Dimensions.get('window').width * 0.96); 7 | const screenLeft = (Dimensions.get('window').width * 0.02); 8 | 9 | const cards = [ 10 | { 11 | title: "番剧推荐", 12 | id: 1, 13 | name: "猎兽神兵", 14 | number: "全12话", 15 | count: "69.1万追番", 16 | imageurl: "http://i0.hdslb.com/bfs/archive/81385f895a48a1c27a0e701218781908fb9d5dd2.jpg", 17 | }, 18 | { 19 | id: 1, 20 | name: "鬼灭之刃", 21 | number: "更新至第24话", 22 | count: "476.9万追番", 23 | imageurl: "http://i0.hdslb.com/bfs/archive/efc989798673c8c374cad6e2b4fc555a8f0f3c2c.jpg", 24 | }, 25 | { 26 | id: 1, 27 | name: "女高中生的虚度日常", 28 | number: "更新至第11话", 29 | count: "171.1万追番", 30 | imageurl: "http://i0.hdslb.com/bfs/archive/1c277223735cfe18a32f8130855a20c1a699f706.jpg", 31 | }, 32 | { 33 | id: 1, 34 | name: "某科学的一方通行", 35 | number: "更新至第10话", 36 | count: "217.2万追番", 37 | imageurl: "http://i0.hdslb.com/bfs/archive/def29a30113e96248830b2a984c8feb6749252f4.jpg", 38 | }, 39 | { 40 | id: 2, 41 | name: "爱书的下克上：为了成为图书管理员不择手段！", 42 | number: "更新至第10话", 43 | count: "36万追番", 44 | imageurl: "https://i2.hdslb.com/bfs/archive/b6e413bef190422a10f6c5da448b29bafc272509.jpg", 45 | }, 46 | { 47 | id: 2, 48 | name: "喜欢本大爷的竟然就你一个？", 49 | number: "更新至第9.5话", 50 | count: "159.9万追番", 51 | imageurl: "https://i0.hdslb.com/bfs/archive/6a40cf23518888c0aa5346ba9ca659771463d2df.jpg", 52 | }, 53 | { 54 | id: 2, 55 | name: "碧蓝航线", 56 | number: "更新至第9话", 57 | count: "116.8万追番", 58 | imageurl: "https://i1.hdslb.com/bfs/archive/ba2cb324e57b917e2bd46794540203ff76a7ba52.jpg", 59 | }, 60 | { 61 | id: 2, 62 | name: "刺客守则", 63 | number: "全12话", 64 | count: "114.6万追番", 65 | imageurl: "https://i0.hdslb.com/bfs/archive/e7a0b9d006fe345dabd0fffe45e636a27bba7be9.jpg", 66 | } 67 | 68 | ]; 69 | 70 | class BanMore extends Component { 71 | constructor(props) { 72 | super(props) 73 | this.state = {} 74 | } 75 | render() { 76 | return ( 77 | 78 |
79 | 80 | {Actions.pop()}}> 81 | 82 | 83 | 更多番剧 84 | 85 | 86 | 87 |
88 | i} // 解决 key 问题 91 | renderItem={({ item }) => this.renderItem(item)} // 调用方法，去渲染每一项 92 | //ItemSeparatorComponent={this.renderSeparator} //渲染分割线的属性方法 93 | onEndReachedThreshold={0.5} // 距离底部还有多远的时候，触发加载更多的事件 94 | //onEndReached={this.loadNextPage} // 当距离不足 0.5 的时候，触发这个方法，加载下一页数据 95 | style={{ backgroundColor: "#FFFFFF" }} 96 | /> 97 | 98 | ); 99 | } 100 | 101 | renderItem = (item) => { 102 | return 103 | 104 | 105 | {/*justify-content:主軸的對齊 */} 106 | 107 | 番剧名称：{item.name} 108 | 番剧集数：{item.number} 109 | 追番人数：{item.count}分 110 | 113 | 114 | 115 | 116 | } 117 | 118 | 119 | 120 | } 121 | 122 | 123 | 124 | export default BanMore; -------------------------------------------------------------------------------- /src/components/GuoItem.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView} from 'react-native'; 3 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 4 | 5 | const BannerWidth = (Dimensions.get('window').width * 0.96); 6 | const screenLeft = (Dimensions.get('window').width * 0.02); 7 | 8 | //卡片图片资源 9 | const cards = [ 10 | { 11 | id:1, 12 | name: "斩兽之刃", 13 | number: "更新至第9话", 14 | count: "43.9万系列追番", 15 | imageurl: "http://i0.hdslb.com/bfs/archive/148be0d6209c7a7538998467f50dae3c6f21f322.jpg", 16 | }, 17 | { 18 | id:1, 19 | name: "画江湖之不良人 第三季", 20 | number: "更新至第36话", 21 | count: "132.8万系列追番", 22 | imageurl: "http://i0.hdslb.com/bfs/archive/ad8fe0bbc56b951a57e02142b79b4e9e7137b2e3.jpg", 23 | }, 24 | { 25 | id:1, 26 | name: "阴阳师·平安物语", 27 | number: "全24话", 28 | count: "140.8万系列追番", 29 | imageurl: "http://i0.hdslb.com/bfs/archive/2e2198e297e98fe77b007710a3cefa9683e31898.jpg", 30 | }, 31 | { 32 | id:1, 33 | name: "我家大师兄脑子有坑 特别篇", 34 | number: "更新至第48话", 35 | count: "196.8万系列追番", 36 | imageurl: "http://i0.hdslb.com/bfs/archive/55cd9010e59c310b3ccf6281b4ec57bf44967054.jpg", 37 | }, 38 | { 39 | id:2, 40 | name: "驸马不要啊 动态漫 第三季", 41 | number: "更新至第3话", 42 | count: "2.1万系列追番", 43 | imageurl: "https://i0.hdslb.com/bfs/archive/e8044696aabbdfaad302980cc27aedc374c5a74e.jpg", 44 | }, 45 | 46 | { 47 | id:2, 48 | name: "伍六七之最强发现师", 49 | number: "更新至第6话", 50 | count: "526.1万系列追番", 51 | imageurl: "https://i1.hdslb.com/bfs/archive/5ac5302075abf6bc7ba0efe076f6050499ea3715.jpg", 52 | }, 53 | { 54 | id:2, 55 | name: "少女前线 人形小剧场", 56 | number: "更新至第9话", 57 | count: "48.1万系列追番", 58 | imageurl: "https://i2.hdslb.com/bfs/archive/6a3fcb2d057598b03883762205b8d5723a73e2d0.jpg", 59 | }, 60 | { 61 | id:2, 62 | name: "餐桌上的世说新语", 63 | number: "全12话", 64 | count: "18.4万系列追番", 65 | imageurl: "https://i0.hdslb.com/bfs/archive/7c481c3b86e2a2c3729e6d47419d83888473b0bd.jpg", 66 | }, 67 | 68 | 69 | 70 | ]; 71 | 72 | class GuoItem extends Component { 73 | constructor(props) { 74 | super(props) 75 | this.state = { 76 | flag:true 77 | } 78 | } 79 | 80 | handleClick=()=>{ 81 | this.setState({flag:!this.state.flag}) 82 | } 83 | 84 | 85 | render() { 86 | return ( 87 | 88 | 89 | 90 | 国创推荐 91 | 92 | 93 | 96 | 97 | 98 | 99 | { 100 | cards.map((item,index)=>{ 101 | if(this.state.flag && item.id==1){ 102 | return ( 103 | 104 | 105 | 106 | 107 | 会员抢先 108 | 109 | {item.count} 110 | 111 | 112 | {item.name} 113 | {item.number} 114 | 115 | )} 116 | else if(!this.state.flag && item.id==2){ 117 | return ( 118 | 119 | 120 | 121 | 122 | 会员抢先 123 | 124 | {item.count} 125 | 126 | 127 | {item.name} 128 | {item.number} 129 | 130 | )} 131 | }) 132 | } 133 | 134 | 135 | 140 | 141 | 142 | ) 143 | } 144 | 145 | } 146 | 147 | const styles = StyleSheet.create({ 148 | //番剧卡片 149 | fanju: { 150 | width: BannerWidth, 151 | height: 375, 152 | marginLeft: screenLeft, 153 | overflow: "hidden", 154 | marginTop: 15, 155 | flex: 1, 156 | // 横向 居中 157 | flexDirection: 'row', 158 | position: "relative", 159 | borderBottomWidth: 0.5, 160 | borderBottomColor: "#DCDCDC", 161 | }, 162 | //番剧卡片标题 163 | fanjutitle: { 164 | width: "100%", 165 | height: 30, 166 | flex: 1, 167 | flexDirection: 'row', 168 | fontSize: 5, 169 | fontWeight: "normal" 170 | 171 | }, 172 | //番剧卡片的中间四个小卡片 173 | fanjucards: { 174 | width: "100%", 175 | height: 310, 176 | position: "absolute", 177 | top: 30, 178 | left: 0, 179 | right: 0, 180 | borderRadius: 5, 181 | overflow: "hidden", 182 | flex: 1, 183 | flexDirection: "row", 184 | flexWrap: "wrap", 185 | justifyContent: "space-between", 186 | alignContent: "space-between", 187 | 188 | }, 189 | //一个小卡片 190 | fanjucard: { 191 | width: "48%", 192 | height: 150, 193 | borderRadius: 5, 194 | overflow: "hidden", 195 | }, 196 | //浮在卡片上一层的样式 197 | surface: { 198 | width: "100%", 199 | height: 110, 200 | position: "absolute", 201 | top: 0, 202 | left: 0, 203 | zIndex: 100 204 | }, 205 | //左上角 心 206 | surfaceicon: { 207 | width: 30, 208 | height: 25, 209 | fontSize: 22, 210 | borderBottomRightRadius: 5, 211 | textAlign: "center", 212 | lineHeight: 24, 213 | // 设置背景颜色时同时设置透明度 防止背景颜色影响字体颜色 214 | color: "white", 215 | backgroundColor: 'rgba(0, 0, 0, 0.4)', 216 | }, 217 | 218 | }) 219 | 220 | 221 | 222 | 223 | export default GuoItem; -------------------------------------------------------------------------------- /src/components/MovieOne.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView } from 'react-native'; 3 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 4 | 5 | const BannerWidth = (Dimensions.get('window').width * 0.96); 6 | const screenLeft = (Dimensions.get('window').width * 0.02); 7 | 8 | const cards = [ 9 | { 10 | id:1, 11 | count: "14.2万追剧", 12 | name: "守护解放西", 13 | title: "9月14日，警动全城", 14 | imageurl:"http://i0.hdslb.com/bfs/bangumi/29e7ea9cf0a619618841caeca1a61032e4f0a2c6.jpg" , 15 | }, 16 | { 17 | id:1, 18 | count: "", 19 | name: "真实的残酷宫斗" , 20 | title: "亨利八世6位皇后" , 21 | imageurl: "http://i0.hdslb.com/bfs/bangumi/5a95404be7ecacc69167c3eb5e4d3b5383bef25b.png", 22 | }, 23 | { 24 | id:1, 25 | badge: "限时免费", 26 | count: "236.4万系列追剧", 27 | name: "人生一串2", 28 | title: "上串开吃！", 29 | imageurl: "http://i0.hdslb.com/bfs/bangumi/7db272b2e887bb3615a8aee29cf4ed839dc54e82.png", 30 | }, 31 | { 32 | id:1, 33 | count:"22.6万系列追剧", 34 | name: "糟糕的历史", 35 | title: "最魔性历史纪录片", 36 | imageurl: "http://i0.hdslb.com/bfs/bangumi/f3091de24e5ff374ae3920513fecce70a63dc039.jpg", 37 | }, 38 | { 39 | id:1, 40 | count: "", 41 | name: "FOX的北极之旅", 42 | title: "感受北欧极致壮美", 43 | imageurl: "http://i0.hdslb.com/bfs/bangumi/2a2b86986e3e4fcb183f0a282c439bc5f130e9e6.jpg", 44 | }, 45 | { 46 | id:1, 47 | count: "26.2万系列追剧", 48 | name: "我们该玩电子游戏吗", 49 | title: "游戏有助身心健康？", 50 | imageurl:"http://i0.hdslb.com/bfs/bangumi/acda1d7fd8565706b5fd0cb9c0f7b40813467fcc.jpg", 51 | }, 52 | // { 53 | // id:1, 54 | // count: "21.1万系列追剧", 55 | // name: "【纪录】中国古建筑 (2012)", 56 | // title: "中国古建筑之“大势", 57 | // imageurl: "https://i0.hdslb.com/bfs/archive/ad068ea233ef0f4e43158bac020a92c9bd0724dc.jpg", 58 | // }, 59 | // { 60 | // id:1, 61 | // count: "31.8万系列追剧", 62 | // name: "未至之境（英配版）", 63 | // title: "一起探索无人之境", 64 | // imageurl: "https://i0.hdslb.com/bfs/archive/ffd662bc2eb4959574180187155c80b4a1a087be.png", 65 | // }, 66 | ]; 67 | 68 | class MovieOne extends Component { 69 | constructor(props) { 70 | super(props) 71 | this.state = { 72 | flag: true 73 | } 74 | } 75 | 76 | handleClick = () => { 77 | this.setState({ flag: !this.state.flag }) 78 | } 79 | 80 | render() { 81 | 82 | return ( 83 | 84 | 85 | 86 | 纪录片热播 87 | 88 | 89 | 92 | 93 | 94 | 95 | { 96 | cards.map((item, index) => { 97 | const bubble=item.badge ? ( 98 | 99 | {item.badge} 100 | ):null 101 | 102 | return ( 103 | 104 | 105 | 106 | {bubble} 107 | {item.count} 108 | 109 | 110 | {item.name} 111 | {item.title} 112 | 113 | ) 114 | 115 | }) 116 | } 117 | 118 | 119 | 124 | 125 | 126 | ) 127 | } 128 | 129 | } 130 | 131 | const styles = StyleSheet.create({ 132 | //番剧卡片 133 | fanju: { 134 | width: BannerWidth, 135 | height: 525, 136 | marginLeft: screenLeft, 137 | overflow: "hidden", 138 | marginTop: 15, 139 | flex: 1, 140 | // 横向 居中 141 | flexDirection: 'row', 142 | position: "relative", 143 | borderBottomWidth: 0.5, 144 | borderBottomColor: "#DCDCDC", 145 | }, 146 | //番剧卡片标题 147 | fanjutitle: { 148 | width: "100%", 149 | height: 30, 150 | flex: 1, 151 | flexDirection: 'row', 152 | fontSize: 5, 153 | fontWeight: "normal" 154 | 155 | }, 156 | //番剧卡片的中间六个小卡片 157 | fanjucards: { 158 | width: "100%", 159 | height: 460, 160 | position: "absolute", 161 | top: 30, 162 | left: 0, 163 | right: 0, 164 | borderRadius: 5, 165 | overflow: "hidden", 166 | flexDirection: "row", 167 | flexWrap: "wrap", 168 | justifyContent:"space-between", 169 | alignContent:"space-between" 170 | 171 | 172 | }, 173 | //一个小卡片 174 | fanjucard: { 175 | width: "31%", 176 | height: 220, 177 | borderRadius: 5, 178 | overflow: "hidden", 179 | 180 | }, 181 | //浮在卡片上一层的样式 182 | surface: { 183 | width: "100%", 184 | height: 180, 185 | position: "absolute", 186 | top: 0, 187 | left: 0, 188 | zIndex: 100 189 | }, 190 | //左上角 心 191 | surfaceicon: { 192 | width: 30, 193 | height: 25, 194 | fontSize: 22, 195 | borderBottomRightRadius: 5, 196 | textAlign: "center", 197 | lineHeight: 24, 198 | // 设置背景颜色时同时设置透明度 防止背景颜色影响字体颜色 199 | color: "white", 200 | backgroundColor: 'rgba(0, 0, 0, 0.4)', 201 | }, 202 | 203 | }) 204 | 205 | 206 | 207 | 208 | export default MovieOne; -------------------------------------------------------------------------------- /src/components/MovieThree.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView } from 'react-native'; 3 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 4 | 5 | const BannerWidth = (Dimensions.get('window').width * 0.96); 6 | const screenLeft = (Dimensions.get('window').width * 0.02); 7 | 8 | //卡片图片资源 9 | const cards = [ 10 | { 11 | id: 1, 12 | count: "1.9万追剧", 13 | name: "大恋爱", 14 | title: "和喜欢的人一起吃饭", 15 | imageurl: "http://i0.hdslb.com/bfs/bangumi/29e7ea9cf0a619618841caeca1a61032e4f0a2c6.jpg", 16 | }, 17 | { 18 | id: 1, 19 | badge: "会员抢先", 20 | count: "1.3万追剧", 21 | name: "万福", 22 | title: "你醒啦", 23 | imageurl: "http://i0.hdslb.com/bfs/bangumi/4c6748f24b0cee23fe71d387a820e7b1e651ccb3.jpg", 24 | }, 25 | { 26 | id: 1, 27 | count: "15.6万系列追剧", 28 | name: "双姝 第二季", 29 | title: "即将上线", 30 | imageurl: "http://i0.hdslb.com/bfs/bangumi/5c104fc023c5a6f9b6f59cd83d276a8c86f4d21d.jpg", 31 | }, 32 | { 33 | id: 1, 34 | badge: "会员抢先", 35 | count: "9520追剧", 36 | name: "警察之家", 37 | title: "是兔子还是螃蟹", 38 | imageurl: "http://i0.hdslb.com/bfs/bangumi/2bf8fb89f3a386e37e08556d89842590655f3647.png", 39 | }, 40 | { 41 | id: 1, 42 | badge: "限时免费", 43 | count: "4.9万追剧", 44 | name: "萤之光 第一季", 45 | title: "情侣同款睡姿", 46 | imageurl: "http://i0.hdslb.com/bfs/bangumi/4a28a26cf87a1f9f4c5a5392b3c69a2f39d64a5c.jpg", 47 | }, 48 | { 49 | id: 1, 50 | badge: "会员专享", 51 | count: "1.6万追剧", 52 | name: "原以为命中注定的恋爱", 53 | title: "不会发生在我身上", 54 | imageurl: "http://i0.hdslb.com/bfs/bangumi/9c6401a78ee23cadb7c8338af517e0b1be489535.jpg", 55 | }, 56 | 57 | ]; 58 | 59 | class MovieThree extends Component { 60 | constructor(props) { 61 | super(props) 62 | this.state = { 63 | flag: true 64 | } 65 | } 66 | 67 | handleClick = () => { 68 | this.setState({ flag: !this.state.flag }) 69 | } 70 | 71 | 72 | 73 | render() { 74 | 75 | return ( 76 | 77 | 78 | 79 | 电视剧热播 80 | 81 | 82 | 85 | 86 | 87 | 88 | { 89 | cards.map((item, index) => { 90 | const bubble=item.badge ? ( 91 | 92 | {item.badge} 93 | ):null 94 | 95 | return ( 96 | 97 | 98 | 99 | {bubble} 100 | {item.count} 101 | 102 | 103 | {item.name} 104 | {item.title} 105 | 106 | ) 107 | 108 | }) 109 | } 110 | 111 | 112 | 117 | 118 | 119 | ) 120 | } 121 | 122 | } 123 | 124 | const styles = StyleSheet.create({ 125 | //番剧卡片 126 | fanju: { 127 | width: BannerWidth, 128 | height: 525, 129 | marginLeft: screenLeft, 130 | overflow: "hidden", 131 | marginTop: 15, 132 | flex: 1, 133 | // 横向 居中 134 | flexDirection: 'row', 135 | position: "relative", 136 | borderBottomWidth: 0.5, 137 | borderBottomColor: "#DCDCDC", 138 | }, 139 | //番剧卡片标题 140 | fanjutitle: { 141 | width: "100%", 142 | height: 30, 143 | flex: 1, 144 | flexDirection: 'row', 145 | fontSize: 5, 146 | fontWeight: "normal" 147 | 148 | }, 149 | //番剧卡片的中间六个小卡片 150 | fanjucards: { 151 | width: "100%", 152 | height: 460, 153 | position: "absolute", 154 | top: 30, 155 | left: 0, 156 | right: 0, 157 | borderRadius: 5, 158 | overflow: "hidden", 159 | flex: 1, 160 | flexDirection: "row", 161 | flexWrap: "wrap", 162 | justifyContent: "space-between", 163 | alignContent: "space-between", 164 | 165 | }, 166 | //一个小卡片 167 | fanjucard: { 168 | width: "48%", 169 | height: 150, 170 | borderRadius: 5, 171 | overflow: "hidden", 172 | }, 173 | //浮在卡片上一层的样式 174 | surface: { 175 | width: "100%", 176 | height: 110, 177 | position: "absolute", 178 | top: 0, 179 | left: 0, 180 | zIndex: 100 181 | }, 182 | //左上角 心 183 | surfaceicon: { 184 | width: 30, 185 | height: 25, 186 | fontSize: 22, 187 | borderBottomRightRadius: 5, 188 | textAlign: "center", 189 | lineHeight: 24, 190 | // 设置背景颜色时同时设置透明度 防止背景颜色影响字体颜色 191 | color: "white", 192 | backgroundColor: 'rgba(0, 0, 0, 0.4)', 193 | }, 194 | 195 | }) 196 | 197 | 198 | 199 | 200 | export default MovieThree; -------------------------------------------------------------------------------- /src/components/MovieTwo.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView } from 'react-native'; 3 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 4 | 5 | const BannerWidth = (Dimensions.get('window').width * 0.96); 6 | const screenLeft = (Dimensions.get('window').width * 0.02); 7 | 8 | const cards = [ 9 | { 10 | id:1, 11 | badge: "会员专享", 12 | count: "71万系列追剧", 13 | name: "哈利·波特与死亡圣器(下)", 14 | title: "终极之战打响", 15 | imageurl:"http://i0.hdslb.com/bfs/bangumi/abcafcf95a0853f709d735f10561b993d0fc05bd.jpg" , 16 | }, 17 | { 18 | id:1, 19 | badge: "会员专享", 20 | count: "71万系列追剧", 21 | name: "哈利·波特与死亡圣器(上)" , 22 | title: "三人组寻找魂器" , 23 | imageurl: "http://i0.hdslb.com/bfs/bangumi/d435abc79671d66ce826eea03911b3d3074d27b7.jpg", 24 | }, 25 | { 26 | id:1, 27 | badge: "会员半价", 28 | count: "14.6万追剧", 29 | name: "蜘蛛侠：英雄远征", 30 | title: "小蜘蛛登陆B站！", 31 | imageurl: "http://i0.hdslb.com/bfs/bangumi/37ecc29ada354bc61b9e237203fff3f4f358f731.jpg", 32 | }, 33 | { 34 | id:1, 35 | count:"2.6万追剧", 36 | name: "罗生门", 37 | title: "黑泽明经典悬疑神作", 38 | imageurl:"http://i0.hdslb.com/bfs/bangumi/9050447827d4c7fd88f6a8c536b84e3a0e1b6912.jpg", 39 | }, 40 | { 41 | id:1, 42 | count: "73.6万追剧", 43 | name: "我想吃掉你的胰脏", 44 | title: "免费首播！", 45 | imageurl: "http://i0.hdslb.com/bfs/bangumi/fd5891a000ecdf6e76fdfea1fc204776f728c9ba.jpg", 46 | }, 47 | { 48 | id:1, 49 | count: "9992追剧", 50 | name: "东京物语", 51 | title: "东京真的太远了", 52 | imageurl:"http://i0.hdslb.com/bfs/bangumi/42af0d04487472725d24ff3bfa01a347f87e7248.jpg", 53 | }, 54 | // { 55 | // id:1, 56 | // count: "2.8万追剧", 57 | // name: "毒战", 58 | // title: "【古天乐/孙红雷】", 59 | // imageurl: "https://i0.hdslb.com/bfs/archive/9ca6b32956a8abbcae1cb9db17ddaa71509446f8.jpg", 60 | // }, 61 | // { 62 | // id:1, 63 | // count: "13.2万追剧", 64 | // name: "怦然心动", 65 | // title: "重温心动初恋", 66 | // imageurl:"https://i1.hdslb.com/bfs/archive/94b509c59ceb8ad29f47fa39630367b860e96d48.jpg", 67 | // }, 68 | ]; 69 | 70 | class MovieTwo extends Component { 71 | constructor(props) { 72 | super(props) 73 | this.state = { 74 | flag: true 75 | } 76 | } 77 | 78 | handleClick = () => { 79 | this.setState({ flag: !this.state.flag }) 80 | } 81 | 82 | render() { 83 | 84 | return ( 85 | 86 | 87 | 88 | 电影热播 89 | 90 | 91 | 94 | 95 | 96 | 97 | { 98 | cards.map((item, index) => { 99 | const bubble=item.badge ? ( 100 | 101 | {item.badge} 102 | ):null 103 | 104 | return ( 105 | 106 | 107 | 108 | {bubble} 109 | {item.count} 110 | 111 | 112 | {item.name} 113 | {item.title} 114 | 115 | ) 116 | 117 | }) 118 | } 119 | 120 | 121 | 126 | 127 | 128 | ) 129 | } 130 | 131 | } 132 | 133 | const styles = StyleSheet.create({ 134 | //番剧卡片 135 | fanju: { 136 | width: BannerWidth, 137 | height: 525, 138 | marginLeft: screenLeft, 139 | overflow: "hidden", 140 | marginTop: 15, 141 | flex: 1, 142 | // 横向 居中 143 | flexDirection: 'row', 144 | position: "relative", 145 | borderBottomWidth: 0.5, 146 | borderBottomColor: "#DCDCDC", 147 | }, 148 | //番剧卡片标题 149 | fanjutitle: { 150 | width: "100%", 151 | height: 30, 152 | flex: 1, 153 | flexDirection: 'row', 154 | fontSize: 5, 155 | fontWeight: "normal" 156 | 157 | }, 158 | //番剧卡片的中间六个小卡片 159 | fanjucards: { 160 | width: "100%", 161 | height: 460, 162 | position: "absolute", 163 | top: 30, 164 | left: 0, 165 | right: 0, 166 | borderRadius: 5, 167 | overflow: "hidden", 168 | flexDirection: "row", 169 | flexWrap: "wrap", 170 | justifyContent:"space-between", 171 | alignContent:"space-between" 172 | 173 | 174 | }, 175 | //一个小卡片 176 | fanjucard: { 177 | width: "31%", 178 | height: 220, 179 | borderRadius: 5, 180 | overflow: "hidden", 181 | 182 | }, 183 | //浮在卡片上一层的样式 184 | surface: { 185 | width: "100%", 186 | height: 180, 187 | position: "absolute", 188 | top: 0, 189 | left: 0, 190 | zIndex: 100 191 | }, 192 | //左上角 心 193 | surfaceicon: { 194 | width: 30, 195 | height: 25, 196 | fontSize: 22, 197 | borderBottomRightRadius: 5, 198 | textAlign: "center", 199 | lineHeight: 24, 200 | // 设置背景颜色时同时设置透明度 防止背景颜色影响字体颜色 201 | color: "white", 202 | backgroundColor: 'rgba(0, 0, 0, 0.4)', 203 | }, 204 | 205 | }) 206 | 207 | 208 | 209 | 210 | export default MovieTwo; -------------------------------------------------------------------------------- /src/pages/Classify.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text, ScrollView } from 'react-native' 3 | 4 | class Classify extends Component { 5 | constructor(props) { 6 | super(props); 7 | } 8 | render() { 9 | return ( 10 | 11 | ); 12 | } 13 | } 14 | 15 | export default Classify; -------------------------------------------------------------------------------- /src/pages/Dynamic.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | // import { View, Text } from 'react-native' 3 | import { View, StyleSheet, ScrollView, PanResponder, Text } from "react-native"; 4 | 5 | 6 | class Dynamic extends Component { 7 | constructor(props) { 8 | super(props); 9 | this.state = {} 10 | } 11 | render() { 12 | return ( 13 | 14 | ) 15 | } 16 | } 17 | const styles = StyleSheet.create({ 18 | container: { 19 | flex: 1, 20 | justifyContent: 'center', 21 | alignItems: 'center', 22 | backgroundColor: '#F5FCFF', 23 | }, 24 | pan_container: { 25 | ...StyleSheet.absoluteFillObject, 26 | backgroundColor: 'blue' 27 | }, 28 | scroll_view: { 29 | backgroundColor: 'teal', 30 | maxHeight: 350 31 | } 32 | }); 33 | 34 | export default Dynamic; -------------------------------------------------------------------------------- /src/pages/HomePage.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text, StyleSheet } from 'react-native' 3 | 4 | import { Container, Tab, Tabs, ScrollableTab } from 'native-base'; 5 | 6 | import Live from './home_sub_pages/Live'; 7 | import Recommended from './home_sub_pages/Recommended'; 8 | import Hot from './home_sub_pages/Hot'; 9 | import Bangumi from './home_sub_pages/Bangumi'; 10 | import Movie from './home_sub_pages/Movie'; 11 | import SeventyYears from './home_sub_pages/SeventyYears'; 12 | 13 | class HomePage extends Component { 14 | 15 | constructor(props) { 16 | super(props); 17 | this.state = { 18 | locked: false 19 | } 20 | } 21 | render() { 22 | return ( 23 | 24 | {/*
*/} 25 | 26 | }> 31 | 37 | 38 | 39 | 45 | 46 | 47 | 53 | 54 | 55 | 61 | 62 | 63 | 69 | 70 | 71 | 77 | 78 | 79 | 80 | 81 | ) 82 | } 83 | } 84 | const styles = StyleSheet.create({ 85 | tabStyle: { 86 | // width: 84, 87 | margin: 0, 88 | padding: 0, 89 | backgroundColor: '#fff', 90 | alignItems: 'center', 91 | 92 | }, 93 | activeTabStyle: { 94 | // width: 84, 95 | backgroundColor: '#fff' 96 | }, 97 | textStyle: { 98 | textAlign: 'center', 99 | color: '#444' 100 | }, 101 | activeTextStyle: { 102 | textAlign: 'center', 103 | color: '#fb7b9e', 104 | fontWeight: 'bold' 105 | }, 106 | tabsContainerStyle: { 107 | // width: 400, 108 | backgroundColor: '#fff' 109 | } 110 | }) 111 | 112 | export default HomePage; -------------------------------------------------------------------------------- /src/pages/MemberBuy.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text } from 'react-native' 3 | 4 | class MemberBuy extends Component { 5 | state = {} 6 | render() { 7 | return ( 8 | 9 | 10 | ); 11 | } 12 | } 13 | 14 | export default MemberBuy; -------------------------------------------------------------------------------- /src/pages/home_sub_pages/Bangumi.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import Carousel from 'react-native-banner-carousel'; 3 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView } from 'react-native'; 4 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 5 | import BanItem from '../../components/BanItem' 6 | import GuoItem from '../../components/GuoItem' 7 | 8 | 9 | 10 | //轮播图片数据 11 | const images = [ 12 | "http://i0.hdslb.com/bfs/bangumi/a085f60bda7f18226accf3993b328e17f419c00d.jpg", 13 | "http://i0.hdslb.com/bfs/bangumi/8c39135d5191acbe0f0108ede3dbc76b6342cd36.jpg", 14 | "http://i0.hdslb.com/bfs/bangumi/105c45fa8538c897e85e44f3811eda2de2d79b85.jpg", 15 | "http://i0.hdslb.com/bfs/bangumi/20429c37693f67e5310f3b4d02f96c2b7403a6ec.jpg" 16 | ]; 17 | const texts = [ 18 | "FGO动画专题页", 19 | "少女前线 人形小剧场：第9话", 20 | "风起绿林", 21 | "【一周资讯】第37期" 22 | ]; 23 | 24 | const BannerWidth = (Dimensions.get('window').width * 0.96); 25 | const BannerHeight = 180; 26 | 27 | //导航栏图标资源 28 | const icons = [ 29 | "http://i0.hdslb.com/bfs/bangumi/125ba229db0dcc3b5a9fe110ba3f4984ddc2c775.png", 30 | "http://i0.hdslb.com/bfs/bangumi/2c782d7a8127d0de8667321d4071eebff01ea977.png", 31 | "http://i0.hdslb.com/bfs/bangumi/7a7d9db1911b7cbfdad44ae953dd5acc49ef5187.png", 32 | "http://i0.hdslb.com/bfs/bangumi/76c03a7ca20815765c7f5bc17d320e0676e15a20.png", 33 | "http://i0.hdslb.com/bfs/bangumi/e713a764f9146b73673ba9b126d963aa50f4fc3b.png", 34 | ]; 35 | const iconTexts = [ 36 | "国创", 37 | "番剧", 38 | "时间表", 39 | "索引", 40 | "热门榜单" 41 | ]; 42 | 43 | class Bangumi extends Component { 44 | constructor(props) { 45 | super(props); 46 | this.state = { 47 | y:0 48 | } 49 | } 50 | 51 | //渲染轮播图片 52 | renderPage(image, index) { 53 | let count = index; 54 | return ( 55 | 56 | {texts[count]} 57 | 58 | 59 | ); 60 | 61 | } 62 | 63 | // 滑动触发 64 | _onScroll=(e)=>{ 65 | // 获取滑动的距离 66 | let { y } = e.nativeEvent.contentOffset; 67 | // console.log("y的值"+y) 68 | this.setState({ 69 | y 70 | }) 71 | 72 | } 73 | 74 | 75 | render() { 76 | return ( 77 | 78 | 81 | {/* 轮播图片 */} 82 | 83 | 93 | {images.map((image, index) => this.renderPage(image, index))} 94 | 95 | 96 | 97 | {/* 导航栏 */} 98 | 99 | 100 | {icons.map((item, index) => { 101 | let font = index; 102 | return ( 103 | 104 | 105 | {iconTexts[font]} 106 | 107 | ); 108 | })} 109 | 110 | 111 | {/* 登录图片 */} 112 | 113 | 114 | 115 | {/* 番剧推荐 */} 116 | 117 | 118 | 119 | 120 | {/* 国创卡片 */} 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | ); 133 | } 134 | } 135 | 136 | 137 | const styles = StyleSheet.create({ 138 | //轮播图样式 139 | container: { 140 | flex: 1, 141 | backgroundColor: '#fff', 142 | // 横向 居中 143 | flexDirection: 'row', 144 | justifyContent: 'center', 145 | position: "absolute", 146 | top: 5, 147 | right: 0, 148 | left: 0, 149 | //圆角边框 150 | borderRadius: 20, 151 | overflow: "hidden", 152 | }, 153 | //导航栏样式 154 | box: { 155 | width: "100%", 156 | alignItems: "center", 157 | marginTop: 190, 158 | 159 | }, 160 | //登陆图片样式 161 | login: { 162 | width: "100%", 163 | overflow: "hidden", 164 | marginTop: 5, 165 | }, 166 | 167 | 168 | }); 169 | 170 | 171 | export default Bangumi; -------------------------------------------------------------------------------- /src/pages/home_sub_pages/Hot.js: -------------------------------------------------------------------------------- 1 | /** 2 | * 朱继王超 3 | * 2019-12-09 4 | * 首页-热门 5 | */ 6 | 7 | import React, { Component } from 'react'; 8 | import { View, Text, ScrollView, StyleSheet, Image, FlatList, TouchableHighlight } from 'react-native' 9 | 10 | class Hot extends Component { 11 | 12 | constructor(props) { 13 | super(props); 14 | this.state = { 15 | hotList: [], 16 | topItem: [], 17 | testItem: [1, 2, 3] 18 | } 19 | } 20 | 21 | componentDidMount() { 22 | this._getHotList(); 23 | } 24 | 25 | 26 | _getHotList() { 27 | const url = 'https://app.bilibili.com/x/v2/show/popular/index?build=5470400&mobi_app=android&idx=0'; 28 | fetch(url) 29 | .then(res => res.json()) 30 | .then(data => { 31 | if (data.code === 0) { 32 | this.setState((state) => { 33 | return { 34 | hotList: state.hotList.concat(data.data), 35 | topItem: data.config.top_items 36 | } 37 | }) 38 | } 39 | }) 40 | } 41 | 42 | //列表元素按下事件 43 | _onPress(item) { 44 | console.log(item); 45 | } 46 | 47 | //渲染top图标 48 | _renderTopItem = () => { 49 | return this.state.topItem.map((item, index) => { 50 | if (index === 0 || index === 5 || index === 6) { 51 | return ( 52 | 53 | 57 | {item.title} 58 | 59 | ) 60 | } 61 | }) 62 | } 63 | 64 | //推荐理由样式 65 | _setRcmdReasonStyle = (item) => { 66 | if (item.rcmd_reason_style && item.rcmd_reason_style.bg_style === 1 || 67 | item.top_rcmd_reason_style && item.top_rcmd_reason_style.bg_style === 1 68 | ) { 69 | return styles.rcmdReasonTextA 70 | } else if (item.rcmd_reason_style && item.rcmd_reason_style.bg_style === 2 || 71 | item.top_rcmd_reason_style && item.top_rcmd_reason_style.bg_style === 2 72 | ) { 73 | return styles.rcmdReasonTextB 74 | } 75 | return; 76 | } 77 | 78 | //渲染横向滚动元素 79 | _renderthreeItem = ({ item }) => { 80 | return ( 81 | 82 | 84 | 85 | 86 | 87 | {/* {item.title} */} 88 | "吃超漂亮的澳洲白螃蟹！一斤四百但蟹黄会打消你的购买欲！ 89 | 90 | 91 | ) 92 | } 93 | 94 | //热门列表渲染每个item 95 | _renderHotListItem = (item) => { 96 | return this._onPress(item)} 99 | > 100 | 101 | 102 | 104 | {item.cover_right_text_1} 105 | 106 | 107 | {item.title} 108 | 109 | 110 | {item.rcmd_reason_style && item.rcmd_reason_style.text} 111 | 112 | {item.right_desc_1} 113 | {item.right_desc_2} 114 | 115 | 116 | 117 | 118 | } 119 | 120 | //热门列表渲染 121 | _renderHotList = () => { 122 | return ({ item, index, separators }) => { 123 | if (index === 0) { 124 | return ( 125 | 126 | 127 | {this._renderTopItem()} 128 | 129 | {this._renderHotListItem(item)} 130 | 131 | 132 | ) 133 | } else if (item.card_type === "three_item_all_v2") { 134 | return 135 | 136 | 137 | 138 | 139 | {item.title} 140 | 141 | {item.top_rcmd_reason_style && item.top_rcmd_reason_style.text} 142 | 143 | 144 | 145 | 146 | ＋ 关注 147 | 148 | 149 | 150 | index} 154 | renderItem={this._renderthreeItem} 155 | horizontal={true} 156 | showsHorizontalScrollIndicator={false} 157 | /> 158 | 159 | 160 | } else { 161 | return this._renderHotListItem(item); 162 | } 163 | } 164 | } 165 | 166 | render() { 167 | return ( 168 | 169 | 170 | 171 | { }} 173 | refreshing={false} 174 | data={this.state.hotList} 175 | renderItem={this._renderHotList()} 176 | keyExtractor={(item, index) => item.param + index} 177 | /> 178 | 179 | 180 | ) 181 | } 182 | } 183 | const styles = StyleSheet.create({ 184 | topItemList: { 185 | height: 100, 186 | flexDirection: 'row', 187 | justifyContent: 'space-around', 188 | alignItems: 'center' 189 | }, 190 | topItem: { 191 | alignItems: 'center' 192 | }, 193 | title: { 194 | marginTop: 4, 195 | fontSize: 12, 196 | color: '#444' 197 | }, 198 | hotItem: { 199 | height: 120, 200 | borderBottomColor: '#f4f4f4', 201 | borderBottomWidth: 0.5, 202 | padding: 10, 203 | flexDirection: 'row' 204 | }, 205 | hotItemLeft: { 206 | width: '45%', 207 | height: '100%', 208 | position: 'relative' 209 | }, 210 | itemImage: { 211 | width: '100%', 212 | height: '100%', 213 | borderRadius: 5 214 | }, 215 | time: { 216 | position: 'absolute', 217 | bottom: 8, 218 | right: 5, 219 | fontSize: 12, 220 | padding: 4, 221 | paddingTop: 2, 222 | paddingBottom: 2, 223 | backgroundColor: 'rgba(0,0,0,0.4)', 224 | borderRadius: 2, 225 | color: '#fff' 226 | }, 227 | hotItemRight: { 228 | width: '55%', 229 | height: '100%', 230 | paddingLeft: 8, 231 | justifyContent: 'space-between' 232 | }, 233 | itemTitle: { 234 | fontSize: 14, 235 | color: '#000', 236 | width: '100%', 237 | overflow: 'hidden', 238 | }, 239 | desc: { 240 | fontSize: 12, 241 | color: '#c4c4c4', 242 | marginTop: 5, 243 | }, 244 | recmView: { 245 | position: 'relative', 246 | height: 20 247 | }, 248 | rcmdReasonTextA: { 249 | paddingLeft: 2, 250 | paddingRight: 2, 251 | borderWidth: 1, 252 | borderRadius: 2, 253 | fontSize: 10, 254 | bottom: 0, 255 | left: 0, 256 | position: 'absolute', 257 | backgroundColor: '#f5992a', 258 | borderColor: '#f5992a', 259 | color: '#fff' 260 | }, 261 | rcmdReasonTextB: { 262 | paddingLeft: 2, 263 | paddingRight: 2, 264 | borderWidth: 1, 265 | borderRadius: 2, 266 | fontSize: 10, 267 | bottom: 0, 268 | left: 0, 269 | position: 'absolute', 270 | borderColor: '#fdd849', 271 | color: '#fdd849' 272 | }, 273 | hotItemRcmd: { 274 | height: 200, 275 | borderBottomColor: '#f4f4f4', 276 | borderBottomWidth: 0.5, 277 | padding: 10 278 | }, 279 | rcmdTop: { 280 | height: '28%', 281 | flexDirection: 'row', 282 | justifyContent: 'space-between', 283 | alignItems: 'center' 284 | }, 285 | rcmdTopLeft: { 286 | flexDirection: 'row', 287 | }, 288 | upCover: { 289 | height: 40, 290 | width: 40, 291 | borderRadius: 50, 292 | marginRight: 5 293 | }, 294 | upInfoBox: { 295 | position: 'relative', 296 | width: '60%' 297 | }, 298 | upName: { 299 | fontSize: 14, 300 | fontWeight: '700', 301 | color: '#000' 302 | }, 303 | rcmdTopRight: { 304 | height: '50%', 305 | width: '20%', 306 | marginRight: 10, 307 | borderWidth: 1, 308 | borderColor: '#fb7b9e', 309 | borderRadius: 2, 310 | alignItems: 'center', 311 | justifyContent: 'center' 312 | }, 313 | concern: { 314 | fontSize: 12, 315 | color: '#fb7b9e' 316 | }, 317 | rcmdBody: { 318 | height: '75%', 319 | }, 320 | threeItem: { 321 | width: 150, 322 | height: '100%', 323 | marginRight: 10 324 | }, 325 | threeItemCoverBox: { 326 | width: '100%', 327 | height: '70%', 328 | }, 329 | threeItemContentBox: { 330 | 331 | } 332 | }) 333 | 334 | export default Hot; -------------------------------------------------------------------------------- /src/pages/home_sub_pages/Live.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text } from 'react-native' 3 | 4 | class Live extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = {} 8 | } 9 | render() { 10 | return ( 11 | 12 | Live 13 | 14 | ) 15 | } 16 | } 17 | 18 | export default Live; -------------------------------------------------------------------------------- /src/pages/home_sub_pages/Movie.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import Carousel from 'react-native-banner-carousel'; 3 | import { StyleSheet, Image, View, Text, Dimensions, ScrollView } from 'react-native'; 4 | import { Container, Header, Content, Card, CardItem, Thumbnail, Button, Icon, Left, Body, Right, Badge } from 'native-base'; 5 | import MovieOne from '../../components/MovieOne' 6 | import MovieTwo from '../../components/MovieTwo'; 7 | import MovieThree from '../../components/MovieThree' 8 | 9 | 10 | 11 | 12 | //轮播图片数据 13 | const images = [ 14 | "http://i0.hdslb.com/bfs/bangumi/6a11174b96970c2239f9f5064c57e59af70171a6.jpg", 15 | "http://i0.hdslb.com/bfs/bangumi/4c58a6e3d6c9901251250ee4ef9ff5696e3c1db0.jpg", 16 | "http://i0.hdslb.com/bfs/bangumi/98182d952ce44c6d378be97264e7bda0b0fd4c88.jpg", 17 | "http://i0.hdslb.com/bfs/bangumi/923bfb36c57cd643afb6a6c48594695372ff4a72.jpg", 18 | "http://i0.hdslb.com/bfs/bangumi/5afd0231d665fd2ee29c376c292a8b3f0203384b.jpg", 19 | 20 | ]; 21 | 22 | const texts = [ 23 | "吴青峰：怼粉这种事，都是靠灵感", 24 | "中国千年的礼乐智慧", 25 | "一群有能力、有怪癖又可爱的退休警察们", 26 | "破解冻土难题，改写国际预言", 27 | "实拍战机空中机油~", 28 | ]; 29 | 30 | const BannerWidth = (Dimensions.get('window').width * 0.96); 31 | const BannerHeight = 180; 32 | 33 | //导航栏图标资源 34 | const icons = [ 35 | "http://i0.hdslb.com/bfs/bangumi/85e80d8bb430e76eb3e55bbf93d8a62a51e2a774.png", 36 | "http://i0.hdslb.com/bfs/bangumi/a1901aedc680a77c808787cb2cf8e22c7b9c359b.png", 37 | "http://i0.hdslb.com/bfs/bangumi/21bd3247c745e3f1eb489bf637215f8cc8aa86ca.png", 38 | "http://i0.hdslb.com/bfs/bangumi/76c03a7ca20815765c7f5bc17d320e0676e15a20.png", 39 | "http://i0.hdslb.com/bfs/bangumi/e713a764f9146b73673ba9b126d963aa50f4fc3b.png", 40 | 41 | ]; 42 | const iconTexts = [ 43 | "纪录片", 44 | "电影", 45 | "电视剧", 46 | "索引", 47 | "热门榜单" 48 | ]; 49 | 50 | 51 | class Movie extends Component { 52 | constructor(props) { 53 | super(props); 54 | this.state = {} 55 | } 56 | 57 | //渲染轮播图片 58 | renderPage(image, index) { 59 | let count = index; 60 | return ( 61 | 62 | {texts[count]} 63 | 64 | 65 | ); 66 | 67 | } 68 | 69 | render() { 70 | return ( 71 | 72 | 73 | {/* 轮播图片 */} 74 | 75 | 85 | {images.map((image, index) => this.renderPage(image, index))} 86 | 87 | 88 | 89 | {/* 导航栏 */} 90 | 91 | 92 | {icons.map((item, index) => { 93 | let font = index; 94 | return ( 95 | 96 | 97 | {iconTexts[font]} 98 | 99 | ); 100 | })} 101 | 102 | 103 | 104 | {/* 纪录片组件 */} 105 | 106 | 107 | 108 | 109 | {/* 电影组件 */} 110 | 111 | 112 | 113 | 114 | {/* 电视剧组件*/} 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | ) 131 | } 132 | } 133 | 134 | const styles = StyleSheet.create({ 135 | //轮播图样式 136 | container: { 137 | flex: 1, 138 | backgroundColor: '#fff', 139 | // 横向 居中 140 | flexDirection: 'row', 141 | justifyContent: 'center', 142 | position: "absolute", 143 | top: 5, 144 | right: 0, 145 | left: 0, 146 | //圆角边框 147 | borderRadius: 20, 148 | overflow: "hidden", 149 | }, 150 | //导航栏样式 151 | box: { 152 | width: "100%", 153 | alignItems: "center", 154 | marginTop: 190, 155 | 156 | }, 157 | 158 | 159 | }); 160 | 161 | 162 | 163 | 164 | export default Movie; -------------------------------------------------------------------------------- /src/pages/home_sub_pages/Recommended.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text } from 'react-native' 3 | 4 | class Recommended extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = {} 8 | } 9 | render() { 10 | return ( 11 | 12 | Recommended 13 | 14 | ) 15 | } 16 | } 17 | 18 | export default Recommended; -------------------------------------------------------------------------------- /src/pages/home_sub_pages/SeventyYears.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text } from 'react-native' 3 | 4 | class SeventyYears extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = {} 8 | } 9 | render() { 10 | return ( 11 | 12 | SeventyYears 13 | 14 | ) 15 | } 16 | } 17 | 18 | export default SeventyYears; -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'), 2 | 3 | //debug是判断当前是开发环境还是发布环境 4 | debug = process.env.NODE_ENV !== 'production' 5 | 6 | module.exports = { 7 | 8 | //部署应用包时的基本URL，如果是生产环境，部署到 /cli-study/dist 路径；如果是开发环境，部署到根路径 9 | publicPath: process.env.NODE_ENV === 'production' 10 | ? './' 11 | : './', 12 | 13 | //输出文件路径 14 | outputDir: 'dist', 15 | 16 | //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。 17 | assetsDir: 'static', 18 | 19 | //默认情况下，生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存 20 | filenameHashing: true, 21 | 22 | // 是否使用包含运行时编译器的Vue构建版本，设置为 true 后你就可以在 Vue 组件中使用 template 选项了，但是这会让你的应用额外增加 10kb 左右。 23 | runtimeCompiler: true, 24 | 25 | // 默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖，可以在这个选项中列出来。 26 | transpileDependencies: [], 27 | 28 | // 发布环境不需要sourceMap 29 | productionSourceMap: false, 30 | 31 | css: { 32 | 33 | // 默认情况下，只有 *.module.[ext] 结尾的文件才会被视作 CSS Modules 模块。设置为 true 后你就可以去掉文件名中的 .module 并将所有的 *.(css|scss|sass|less|styl(us)?) 文件视为 CSS Modules 模块。 34 | modules: false, 35 | 36 | // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)。 37 | extract: true, 38 | 39 | // 是否构建样式地图，false 将提高构建速度 40 | sourceMap: true, 41 | 42 | // css预设器配置项 43 | loaderOptions: { 44 | css: { 45 | 46 | //这里的选项会传递给 css-loader 47 | }, 48 | postcss: { 49 | 50 | // 这里的选项会传递给 postcss-loader 51 | } 52 | }, 53 | }, 54 | 55 | //所有 webpack-dev-server 的选项都支持 56 | devServer: { 57 | open: true, 58 | host: '127.0.0.1', 59 | port: 3000, 60 | https: false, 61 | hotOnly: false, 62 | proxy: { 63 | //凡是请求以api开头的都会使用下面的代理服务器 64 | '/api/*': { 65 | target: 'http://localhost:8899/', // 目标服务器地址 66 | secure: false, // 目标服务器地址是否是安全协议 67 | changeOrigin: true, // 是否修改来源, 为true时会让目标服务器以为是webpack-dev-server发出的请求!服务端和服务端的请求是没有跨域的 68 | //pathRewrite: {'^/api': '/a'} // 将/api开头的请求地址, /api 改为 /, 即 /api/xx 改为 /xx 69 | } 70 | } 71 | }, 72 | 73 | // 第三方插件配置 74 | pluginOptions: {}, 75 | 76 | //调整webpack配置的最简单的方式 77 | configureWebpack: config => { 78 | if (!debug) { 79 | 80 | // 为生产环境修改配置... 81 | config.devtool = '#cheap-module-source-map' 82 | } else { 83 | 84 | // 为开发环境修改配置... 85 | config.devtool = '#cheap-module-eval-source-map' 86 | } 87 | 88 | Object.assign(config, { // 开发生产共同配置 89 | resolve: { 90 | alias: { 91 | '@': path.resolve(__dirname, './src'), 92 | 'vue$': 'vue/dist/vue.js' 93 | } 94 | } 95 | }) 96 | }, 97 | 98 | //webpack的链式编程 99 | chainWebpack: () => { 100 | if (debug) { 101 | 102 | // 本地开发配置 103 | } else { 104 | 105 | // 生产开发配置 106 | } 107 | }, 108 | 109 | /* pages: { 110 | index: { 111 | // page 的入口 112 | entry: 'src/index/main.js', 113 | // 模板来源 114 | template: 'public/index.html', 115 | // 在 dist/index.html 的输出 116 | filename: 'index.html', 117 | // 当使用 title 选项时， 118 | // template 中的 title 标签需要是 <%= htmlWebpackPlugin.options.title %> 119 | title: 'Index Page', 120 | // 在这个页面中包含的块，默认情况下会包含 121 | // 提取出来的通用 chunk 和 vendor chunk。 122 | //chunk参考：https://segmentfault.com/q/1010000016925412/a-1020000016946034 123 | chunks: ['chunk-vendors', 'chunk-common', 'index'] 124 | } 125 | },*/ 126 | 127 | lintOnSave: false, 128 | } 129 | --------------------------------------------------------------------------------