toki/mattermost-mobile
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add vector icons (#34)

Browse source 
* WIP: Add vector Icons with Android support

* Added IOs support for icons. Linked XCode dependencies.

* Add icon to team selection list as a usage example/test
This commit is contained in:
David Meza 2016-10-20 19:42:31 -05:00 committed by Thomas Hopkins
parent 1a0c741fcd
commit 231fda1160
13 changed files with 73 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
android/app/build.gradle
View file

@ -66,6 +66,7 @@ import com.android.build.OutputFile
*/
apply from: "../../node_modules/react-native/react.gradle"
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
/**
* Set this to true to create two separate APKs instead of one:

BIN
ios/Fonts/Entypo.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/EvilIcons.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/FontAwesome.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/Foundation.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/Ionicons.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/MaterialIcons.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/Octicons.ttf Normal file
View file

Binary file not shown.

BIN
ios/Fonts/Zocial.ttf Normal file
View file

Binary file not shown.

67
ios/Mattermost.xcodeproj/project.pbxproj
View file

@ -22,6 +22,14 @@
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
140ED2AC1D01E1AD002B40FF /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; };
146834051AC3E58100842450 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 146834041AC3E56700842450 /* libReact.a */; };
1EA2B0031DB7E9620013B2DB /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2AFFB1DB7E9620013B2DB /* Entypo.ttf */; };
1EA2B0041DB7E9620013B2DB /* EvilIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2AFFC1DB7E9620013B2DB /* EvilIcons.ttf */; };
1EA2B0051DB7E9620013B2DB /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2AFFD1DB7E9620013B2DB /* FontAwesome.ttf */; };
1EA2B0061DB7E9620013B2DB /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2AFFE1DB7E9620013B2DB /* Foundation.ttf */; };
1EA2B0071DB7E9620013B2DB /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2AFFF1DB7E9620013B2DB /* Ionicons.ttf */; };
1EA2B0081DB7E9620013B2DB /* MaterialIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2B0001DB7E9620013B2DB /* MaterialIcons.ttf */; };
1EA2B0091DB7E9620013B2DB /* Octicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2B0011DB7E9620013B2DB /* Octicons.ttf */; };
1EA2B00A1DB7E9620013B2DB /* Zocial.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1EA2B0021DB7E9620013B2DB /* Zocial.ttf */; };
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
/* End PBXBuildFile section */
@ -106,17 +114,17 @@
/* End PBXContainerItemProxy section */
/* Begin PBXFileReference section */
008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; name = main.jsbundle; path = main.jsbundle; sourceTree = "<group>"; };
00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = ../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj; sourceTree = "<group>"; };
00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = ../node_modules/react-native/Libraries/Geolocation/RCTGeolocation.xcodeproj; sourceTree = "<group>"; };
00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = ../node_modules/react-native/Libraries/Image/RCTImage.xcodeproj; sourceTree = "<group>"; };
00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = ../node_modules/react-native/Libraries/Network/RCTNetwork.xcodeproj; sourceTree = "<group>"; };
00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = ../node_modules/react-native/Libraries/Vibration/RCTVibration.xcodeproj; sourceTree = "<group>"; };
008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = "<group>"; };
00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = "../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj"; sourceTree = "<group>"; };
00C302B51ABCB90400DB3ED1 /* RCTGeolocation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTGeolocation.xcodeproj; path = "../node_modules/react-native/Libraries/Geolocation/RCTGeolocation.xcodeproj"; sourceTree = "<group>"; };
00C302BB1ABCB91800DB3ED1 /* RCTImage.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTImage.xcodeproj; path = "../node_modules/react-native/Libraries/Image/RCTImage.xcodeproj"; sourceTree = "<group>"; };
00C302D31ABCB9D200DB3ED1 /* RCTNetwork.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTNetwork.xcodeproj; path = "../node_modules/react-native/Libraries/Network/RCTNetwork.xcodeproj"; sourceTree = "<group>"; };
00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTVibration.xcodeproj; path = "../node_modules/react-native/Libraries/Vibration/RCTVibration.xcodeproj"; sourceTree = "<group>"; };
00E356EE1AD99517003FC87E /* MattermostTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = MattermostTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
00E356F21AD99517003FC87E /* MattermostTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = MattermostTests.m; sourceTree = "<group>"; };
139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = ../node_modules/react-native/Libraries/Settings/RCTSettings.xcodeproj; sourceTree = "<group>"; };
139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = ../node_modules/react-native/Libraries/WebSocket/RCTWebSocket.xcodeproj; sourceTree = "<group>"; };
139105B61AF99BAD00B5F7CC /* RCTSettings.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTSettings.xcodeproj; path = "../node_modules/react-native/Libraries/Settings/RCTSettings.xcodeproj"; sourceTree = "<group>"; };
139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTWebSocket.xcodeproj; path = "../node_modules/react-native/Libraries/WebSocket/RCTWebSocket.xcodeproj"; sourceTree = "<group>"; };
13B07F961A680F5B00A75B9A /* Mattermost.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = Mattermost.app; sourceTree = BUILT_PRODUCTS_DIR; };
13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = Mattermost/AppDelegate.h; sourceTree = "<group>"; };
13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = Mattermost/AppDelegate.m; sourceTree = "<group>"; };
@ -124,9 +132,17 @@
13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = Mattermost/Images.xcassets; sourceTree = "<group>"; };
13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = Mattermost/Info.plist; sourceTree = "<group>"; };
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = Mattermost/main.m; sourceTree = "<group>"; };
146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = ../node_modules/react-native/React/React.xcodeproj; sourceTree = "<group>"; };
78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = ../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj; sourceTree = "<group>"; };
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = ../node_modules/react-native/Libraries/Text/RCTText.xcodeproj; sourceTree = "<group>"; };
146833FF1AC3E56700842450 /* React.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = React.xcodeproj; path = "../node_modules/react-native/React/React.xcodeproj"; sourceTree = "<group>"; };
1EA2AFFB1DB7E9620013B2DB /* Entypo.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = Entypo.ttf; sourceTree = "<group>"; };
1EA2AFFC1DB7E9620013B2DB /* EvilIcons.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = EvilIcons.ttf; sourceTree = "<group>"; };
1EA2AFFD1DB7E9620013B2DB /* FontAwesome.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = FontAwesome.ttf; sourceTree = "<group>"; };
1EA2AFFE1DB7E9620013B2DB /* Foundation.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = Foundation.ttf; sourceTree = "<group>"; };
1EA2AFFF1DB7E9620013B2DB /* Ionicons.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = Ionicons.ttf; sourceTree = "<group>"; };
1EA2B0001DB7E9620013B2DB /* MaterialIcons.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = MaterialIcons.ttf; sourceTree = "<group>"; };
1EA2B0011DB7E9620013B2DB /* Octicons.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = Octicons.ttf; sourceTree = "<group>"; };
1EA2B0021DB7E9620013B2DB /* Zocial.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = Zocial.ttf; sourceTree = "<group>"; };
78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = "../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj"; sourceTree = "<group>"; };
832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = "../node_modules/react-native/Libraries/Text/RCTText.xcodeproj"; sourceTree = "<group>"; };
/* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */
@ -253,6 +269,21 @@
name = Products;
sourceTree = "<group>";
};
1EA2AFFA1DB7E9620013B2DB /* Fonts */ = {
isa = PBXGroup;
children = (
1EA2AFFB1DB7E9620013B2DB /* Entypo.ttf */,
1EA2AFFC1DB7E9620013B2DB /* EvilIcons.ttf */,
1EA2AFFD1DB7E9620013B2DB /* FontAwesome.ttf */,
1EA2AFFE1DB7E9620013B2DB /* Foundation.ttf */,
1EA2AFFF1DB7E9620013B2DB /* Ionicons.ttf */,
1EA2B0001DB7E9620013B2DB /* MaterialIcons.ttf */,
1EA2B0011DB7E9620013B2DB /* Octicons.ttf */,
1EA2B0021DB7E9620013B2DB /* Zocial.ttf */,
);
path = Fonts;
sourceTree = "<group>";
};
78C398B11ACF4ADC00677621 /* Products */ = {
isa = PBXGroup;
children = (
@ -289,6 +320,7 @@
83CBB9F61A601CBA00E9B192 = {
isa = PBXGroup;
children = (
1EA2AFFA1DB7E9620013B2DB /* Fonts */,
13B07FAE1A68108700A75B9A /* Mattermost */,
832341AE1AAA6A7D00B99B32 /* Libraries */,
00E356EF1AD99517003FC87E /* MattermostTests */,
@ -507,7 +539,15 @@
isa = PBXResourcesBuildPhase;
buildActionMask = 2147483647;
files = (
1EA2B0081DB7E9620013B2DB /* MaterialIcons.ttf in Resources */,
1EA2B0091DB7E9620013B2DB /* Octicons.ttf in Resources */,
1EA2B00A1DB7E9620013B2DB /* Zocial.ttf in Resources */,
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
1EA2B0051DB7E9620013B2DB /* FontAwesome.ttf in Resources */,
1EA2B0041DB7E9620013B2DB /* EvilIcons.ttf in Resources */,
1EA2B0071DB7E9620013B2DB /* Ionicons.ttf in Resources */,
1EA2B0061DB7E9620013B2DB /* Foundation.ttf in Resources */,
1EA2B0031DB7E9620013B2DB /* Entypo.ttf in Resources */,
13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */,
);
runOnlyForDeploymentPostprocessing = 0;
@ -528,7 +568,6 @@
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/packager/react-native-xcode.sh";
showEnvVarsInLog = 1;
};
/* End PBXShellScriptBuildPhase section */
@ -613,7 +652,7 @@
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**",
);
INFOPLIST_FILE = "Mattermost/Info.plist";
INFOPLIST_FILE = Mattermost/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
OTHER_LDFLAGS = (
"$(inherited)",
@ -635,7 +674,7 @@
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**",
);
INFOPLIST_FILE = "Mattermost/Info.plist";
INFOPLIST_FILE = Mattermost/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
OTHER_LDFLAGS = (
"$(inherited)",

11
ios/Mattermost/Info.plist
View file

@ -38,6 +38,17 @@
<false/>
<key>NSLocationWhenInUseUsageDescription</key>
<string></string>
<key>UIAppFonts</key>
<array>
<string>Entypo.ttf</string>
<string>EvilIcons.ttf</string>
<string>FontAwesome.ttf</string>
<string>Foundation.ttf</string>
<string>Ionicons.ttf</string>
<string>MaterialIcons.ttf</string>
<string>Octicons.ttf</string>
<string>Zocial.ttf</string>
</array>
<key>NSAppTransportSecurity</key>
<!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ -->
<dict>

3
package.json
View file

@ -14,7 +14,8 @@
"react-native-router-flux": "3.36.0",
"react-redux": "4.4.5",
"redux": "3.6.0",
"redux-thunk": "2.1.0"
"redux-thunk": "2.1.0",
"react-native-vector-icons": "2.1.0"
},
"devDependencies": {
"babel-eslint": "7.0.0",

6
src/components/select_team_view.js
View file

@ -6,6 +6,7 @@ import React, {Component, PropTypes} from 'react';
import {View, Image} from 'react-native';
import {Actions as Routes} from 'react-native-router-flux';
import Button from 'react-native-button';
import Icon from 'react-native-vector-icons/MaterialIcons';
import _ from 'lodash';
import ErrorText from 'components/error_text';
@ -64,6 +65,11 @@ export default class SelectTeamView extends Component {
containerStyle={GlobalStyles.buttonListItem}
>
{team.display_name}
<Icon
name='keyboard-arrow-right'
size={24}
color='#777'
/>
</Button>
))}
<ErrorText error={this.props.teams.error}/>