1
0
mirror of https://github.com/laurent22/joplin.git synced 2025-11-29 22:48:10 +02:00

iOS: various fixes

This commit is contained in:
Laurent Cozic
2017-11-19 15:19:36 +00:00
parent ca20a2a1c2
commit 4b5c1491d0
6 changed files with 79 additions and 24 deletions

View File

@@ -1,5 +1,5 @@
const React = require('react'); const Component = React.Component;
const { WebView, View, Linking } = require('react-native');
const { Platform, WebView, View, Linking } = require('react-native');
const { globalStyle } = require('lib/components/global-style.js');
const { Resource } = require('lib/models/resource.js');
const { reg } = require('lib/registry.js');
@@ -52,11 +52,17 @@ class NoteBodyViewer extends Component {
const html = this.mdToHtml_.render(note ? note.body : '', this.props.webViewStyle, mdOptions);
let webViewStyle = {}
webViewStyle.opacity = this.state.webViewLoaded ? 1 : 0.01;
// On iOS, the onLoadEnd() event is never fired so always
// display the webview (don't do the little trick
// to avoid the white flash).
if (Platform.OS !== 'ios') {
webViewStyle.opacity = this.state.webViewLoaded ? 1 : 0.01;
}
return (
<View style={style}>
<WebView
scalesPageToFit={false}
style={webViewStyle}
source={{ html: html }}
onLoadEnd={() => this.onLoadEnd()}

View File

@@ -41,7 +41,7 @@ class ScreenHeaderComponent extends Component {
alignItems: 'center',
shadowColor: '#000000',
elevation: 5,
paddingTop: Platform.OS === 'ios' ? 10 : 0, // Extra padding for iOS because the top icons are there
paddingTop: Platform.OS === 'ios' ? 15 : 0, // Extra padding for iOS because the top icons are there
},
divider: {
borderBottomWidth: 1,

View File

@@ -1,5 +1,5 @@
const React = require('react'); const Component = React.Component;
const { Keyboard, BackHandler, View, Button, TextInput, WebView, Text, StyleSheet, Linking, Image } = require('react-native');
const { Platform, Keyboard, BackHandler, View, Button, TextInput, WebView, Text, StyleSheet, Linking, Image } = require('react-native');
const { connect } = require('react-redux');
const { uuid } = require('lib/uuid.js');
const { Log } = require('lib/log.js');
@@ -45,6 +45,9 @@ class NoteScreenComponent extends BaseScreenComponent {
titleTextInputHeight: 20,
};
// iOS doesn't support multiline text fields properly so disable it
this.enableMultilineTitle_ = Platform.OS !== 'ios';
this.saveButtonHasBeenShown_ = false;
this.styles_ = {};
@@ -185,7 +188,7 @@ class NoteScreenComponent extends BaseScreenComponent {
async pickDocument() {
return new Promise((resolve, reject) => {
DocumentPicker.show({ filetype: [DocumentPickerUtil.images()] }, (error,res) => {
DocumentPicker.show({ filetype: [DocumentPickerUtil.allFiles()] }, (error,res) => {
if (error) {
// Also returns an error if the user doesn't pick a file
// so just resolve with null.
@@ -314,6 +317,8 @@ class NoteScreenComponent extends BaseScreenComponent {
}
titleTextInput_contentSizeChange(event) {
if (!this.enableMultilineTitle_) return;
let height = event.nativeEvent.contentSize.height;
this.setState({ titleTextInputHeight: height });
}
@@ -399,14 +404,18 @@ class NoteScreenComponent extends BaseScreenComponent {
backgroundColor: theme.backgroundColor,
fontWeight: 'bold',
fontSize: theme.fontSize,
paddingTop: 10, // Added for iOS (Not needed for Android??)
paddingBottom: 10, // Added for iOS (Not needed for Android??)
};
titleTextInputStyle.height = this.state.titleTextInputHeight;
if (this.enableMultilineTitle_) titleTextInputStyle.height = this.state.titleTextInputHeight;
let checkboxStyle = {
color: theme.color,
paddingRight: 10,
paddingLeft: theme.marginLeft,
paddingTop: 10, // Added for iOS (Not needed for Android??)
paddingBottom: 10, // Added for iOS (Not needed for Android??)
}
const titleComp = (
@@ -415,7 +424,7 @@ class NoteScreenComponent extends BaseScreenComponent {
<TextInput
onContentSizeChange={(event) => this.titleTextInput_contentSizeChange(event)}
autoFocus={isNew}
multiline={true}
multiline={this.enableMultilineTitle_}
underlineColorAndroid="#ffffff00"
autoCapitalize="sentences"
style={titleTextInputStyle}