mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-06-17 07:00:17 +08:00
Convert network overlay to use flatlist
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/21837 Reviewed By: TheSavior Differential Revision: D10449940 Pulled By: RSNara fbshipit-source-id: 28dcd5906c64070ef50867425ae7517d391300e2
This commit is contained in:
alanfoster
committed by
Facebook Github Bot
Facebook Github Bot
parent
3e0bc634b9
commit
efa6016c0d
@@ -10,7 +10,7 @@
|
||||
|
||||
'use strict';
|
||||
|
||||
const ListView = require('ListView');
|
||||
const FlatList = require('FlatList');
|
||||
const React = require('React');
|
||||
const ScrollView = require('ScrollView');
|
||||
const StyleSheet = require('StyleSheet');
|
||||
@@ -21,12 +21,12 @@ const WebSocketInterceptor = require('WebSocketInterceptor');
|
||||
const XHRInterceptor = require('XHRInterceptor');
|
||||
|
||||
const LISTVIEW_CELL_HEIGHT = 15;
|
||||
const SEPARATOR_THICKNESS = 2;
|
||||
|
||||
// Global id for the intercepted XMLHttpRequest objects.
|
||||
let nextXHRId = 0;
|
||||
|
||||
type NetworkRequestInfo = {
|
||||
id: number,
|
||||
type?: string,
|
||||
url?: string,
|
||||
method?: string,
|
||||
@@ -52,54 +52,38 @@ type NetworkRequestInfo = {
|
||||
class NetworkOverlay extends React.Component<
|
||||
Object,
|
||||
{
|
||||
dataSource: ListView.DataSource,
|
||||
newDetailInfo: boolean,
|
||||
detailRowID: ?number,
|
||||
detailRowId: ?number,
|
||||
requests: Array<NetworkRequestInfo>,
|
||||
},
|
||||
> {
|
||||
_requests: Array<NetworkRequestInfo>;
|
||||
_listViewDataSource: ListView.DataSource;
|
||||
_listView: ?ListView;
|
||||
_listViewHighlighted: boolean;
|
||||
_listViewHeight: number;
|
||||
_scrollView: ?ScrollView;
|
||||
_detailViewItems: Array<Array<React.Element<any>>>;
|
||||
_listViewOnLayout: (event: Event) => void;
|
||||
_captureRequestListView: (listRef: ?ListView) => void;
|
||||
_requestsListView: ?FlatList<NetworkRequestInfo>;
|
||||
_detailScrollView: ?ScrollView;
|
||||
_captureRequestsListView: (listRef: ?FlatList<NetworkRequestInfo>) => void;
|
||||
_captureDetailScrollView: (scrollRef: ?ScrollView) => void;
|
||||
_renderRow: (
|
||||
rowData: NetworkRequestInfo,
|
||||
sectionID: number,
|
||||
rowID: number,
|
||||
highlightRow: (sectionID: number, rowID: number) => void,
|
||||
) => React.Element<any>;
|
||||
_renderItem: ({
|
||||
item: NetworkRequestInfo,
|
||||
index: number,
|
||||
}) => ?React.Element<any>;
|
||||
_renderItemDetail: (index: number) => React.Element<any>;
|
||||
_closeButtonClicked: () => void;
|
||||
// Map of `socketId` -> `index in `_requests``.
|
||||
// Map of `socketId` -> `index in `this.state.requests`.
|
||||
_socketIdMap: Object;
|
||||
// Map of `xhr._index` -> `index in `_requests``.
|
||||
// Map of `xhr._index` -> `index in `this.state.requests`.
|
||||
_xhrIdMap: {[key: number]: number};
|
||||
|
||||
constructor(props: Object) {
|
||||
super(props);
|
||||
this._requests = [];
|
||||
this._detailViewItems = [];
|
||||
this._listViewDataSource = new ListView.DataSource({
|
||||
rowHasChanged: (r1, r2) => r1 !== r2,
|
||||
});
|
||||
this.state = {
|
||||
dataSource: this._listViewDataSource.cloneWithRows([]),
|
||||
newDetailInfo: false,
|
||||
detailRowID: null,
|
||||
};
|
||||
this._listViewHighlighted = false;
|
||||
this._listViewHeight = 0;
|
||||
this._captureRequestListView = this._captureRequestListView.bind(this);
|
||||
this._captureRequestsListView = this._captureRequestsListView.bind(this);
|
||||
this._captureDetailScrollView = this._captureDetailScrollView.bind(this);
|
||||
this._listViewOnLayout = this._listViewOnLayout.bind(this);
|
||||
this._renderRow = this._renderRow.bind(this);
|
||||
this._renderItem = this._renderItem.bind(this);
|
||||
|
||||
this._closeButtonClicked = this._closeButtonClicked.bind(this);
|
||||
this._socketIdMap = {};
|
||||
this._xhrIdMap = {};
|
||||
this.state = {
|
||||
detailRowId: null,
|
||||
requests: [],
|
||||
};
|
||||
}
|
||||
|
||||
_enableXHRInterception(): void {
|
||||
@@ -112,20 +96,20 @@ class NetworkOverlay extends React.Component<
|
||||
// to the xhr object as a private `_index` property to identify it,
|
||||
// so that we can distinguish different xhr objects in callbacks.
|
||||
xhr._index = nextXHRId++;
|
||||
const xhrIndex = this._requests.length;
|
||||
const xhrIndex = this.state.requests.length;
|
||||
this._xhrIdMap[xhr._index] = xhrIndex;
|
||||
|
||||
const _xhr: NetworkRequestInfo = {
|
||||
id: xhrIndex,
|
||||
type: 'XMLHttpRequest',
|
||||
method: method,
|
||||
url: url,
|
||||
};
|
||||
this._requests.push(_xhr);
|
||||
this._detailViewItems.push([]);
|
||||
this._genDetailViewItem(xhrIndex);
|
||||
this.setState(
|
||||
{dataSource: this._listViewDataSource.cloneWithRows(this._requests)},
|
||||
this._scrollToBottom(),
|
||||
{
|
||||
requests: this.state.requests.concat(_xhr),
|
||||
},
|
||||
this._scrollRequestsToBottom,
|
||||
);
|
||||
});
|
||||
|
||||
@@ -134,12 +118,15 @@ class NetworkOverlay extends React.Component<
|
||||
if (xhrIndex === -1) {
|
||||
return;
|
||||
}
|
||||
const networkInfo = this._requests[xhrIndex];
|
||||
if (!networkInfo.requestHeaders) {
|
||||
networkInfo.requestHeaders = {};
|
||||
}
|
||||
networkInfo.requestHeaders[header] = value;
|
||||
this._genDetailViewItem(xhrIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[xhrIndex];
|
||||
if (!networkRequestInfo.requestHeaders) {
|
||||
networkRequestInfo.requestHeaders = {};
|
||||
}
|
||||
networkRequestInfo.requestHeaders[header] = value;
|
||||
return {requests};
|
||||
});
|
||||
});
|
||||
|
||||
XHRInterceptor.setSendCallback((data, xhr) => {
|
||||
@@ -147,8 +134,12 @@ class NetworkOverlay extends React.Component<
|
||||
if (xhrIndex === -1) {
|
||||
return;
|
||||
}
|
||||
this._requests[xhrIndex].dataSent = data;
|
||||
this._genDetailViewItem(xhrIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[xhrIndex];
|
||||
networkRequestInfo.dataSent = data;
|
||||
return {requests};
|
||||
});
|
||||
});
|
||||
|
||||
XHRInterceptor.setHeaderReceivedCallback(
|
||||
@@ -157,11 +148,14 @@ class NetworkOverlay extends React.Component<
|
||||
if (xhrIndex === -1) {
|
||||
return;
|
||||
}
|
||||
const networkInfo = this._requests[xhrIndex];
|
||||
networkInfo.responseContentType = type;
|
||||
networkInfo.responseSize = size;
|
||||
networkInfo.responseHeaders = responseHeaders;
|
||||
this._genDetailViewItem(xhrIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[xhrIndex];
|
||||
networkRequestInfo.responseContentType = type;
|
||||
networkRequestInfo.responseSize = size;
|
||||
networkRequestInfo.responseHeaders = responseHeaders;
|
||||
return {requests};
|
||||
});
|
||||
},
|
||||
);
|
||||
|
||||
@@ -171,13 +165,17 @@ class NetworkOverlay extends React.Component<
|
||||
if (xhrIndex === -1) {
|
||||
return;
|
||||
}
|
||||
const networkInfo = this._requests[xhrIndex];
|
||||
networkInfo.status = status;
|
||||
networkInfo.timeout = timeout;
|
||||
networkInfo.response = response;
|
||||
networkInfo.responseURL = responseURL;
|
||||
networkInfo.responseType = responseType;
|
||||
this._genDetailViewItem(xhrIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[xhrIndex];
|
||||
networkRequestInfo.status = status;
|
||||
networkRequestInfo.timeout = timeout;
|
||||
networkRequestInfo.response = response;
|
||||
networkRequestInfo.responseURL = responseURL;
|
||||
networkRequestInfo.responseType = responseType;
|
||||
|
||||
return {requests};
|
||||
});
|
||||
},
|
||||
);
|
||||
|
||||
@@ -192,19 +190,19 @@ class NetworkOverlay extends React.Component<
|
||||
// Show the WebSocket request item in listView when 'connect' is called.
|
||||
WebSocketInterceptor.setConnectCallback(
|
||||
(url, protocols, options, socketId) => {
|
||||
const socketIndex = this._requests.length;
|
||||
const socketIndex = this.state.requests.length;
|
||||
this._socketIdMap[socketId] = socketIndex;
|
||||
const _webSocket: NetworkRequestInfo = {
|
||||
id: socketIndex,
|
||||
type: 'WebSocket',
|
||||
url: url,
|
||||
protocols: protocols,
|
||||
};
|
||||
this._requests.push(_webSocket);
|
||||
this._detailViewItems.push([]);
|
||||
this._genDetailViewItem(socketIndex);
|
||||
this.setState(
|
||||
{dataSource: this._listViewDataSource.cloneWithRows(this._requests)},
|
||||
this._scrollToBottom(),
|
||||
{
|
||||
requests: this.state.requests.concat(_webSocket),
|
||||
},
|
||||
this._scrollRequestsToBottom,
|
||||
);
|
||||
},
|
||||
);
|
||||
@@ -216,10 +214,13 @@ class NetworkOverlay extends React.Component<
|
||||
return;
|
||||
}
|
||||
if (statusCode !== null && closeReason !== null) {
|
||||
this._requests[socketIndex].status = statusCode;
|
||||
this._requests[socketIndex].closeReason = closeReason;
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[socketIndex];
|
||||
networkRequestInfo.status = statusCode;
|
||||
networkRequestInfo.closeReason = closeReason;
|
||||
return {requests};
|
||||
});
|
||||
}
|
||||
this._genDetailViewItem(socketIndex);
|
||||
},
|
||||
);
|
||||
|
||||
@@ -228,12 +229,17 @@ class NetworkOverlay extends React.Component<
|
||||
if (socketIndex === undefined) {
|
||||
return;
|
||||
}
|
||||
if (!this._requests[socketIndex].messages) {
|
||||
this._requests[socketIndex].messages = '';
|
||||
}
|
||||
this._requests[socketIndex].messages +=
|
||||
'Sent: ' + JSON.stringify(data) + '\n';
|
||||
this._genDetailViewItem(socketIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[socketIndex];
|
||||
|
||||
if (!networkRequestInfo.messages) {
|
||||
networkRequestInfo.messages = '';
|
||||
}
|
||||
networkRequestInfo.messages += 'Sent: ' + JSON.stringify(data) + '\n';
|
||||
|
||||
return {requests};
|
||||
});
|
||||
});
|
||||
|
||||
WebSocketInterceptor.setOnMessageCallback((socketId, message) => {
|
||||
@@ -241,12 +247,18 @@ class NetworkOverlay extends React.Component<
|
||||
if (socketIndex === undefined) {
|
||||
return;
|
||||
}
|
||||
if (!this._requests[socketIndex].messages) {
|
||||
this._requests[socketIndex].messages = '';
|
||||
}
|
||||
this._requests[socketIndex].messages +=
|
||||
'Received: ' + JSON.stringify(message) + '\n';
|
||||
this._genDetailViewItem(socketIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[socketIndex];
|
||||
|
||||
if (!networkRequestInfo.messages) {
|
||||
networkRequestInfo.messages = '';
|
||||
}
|
||||
networkRequestInfo.messages +=
|
||||
'Received: ' + JSON.stringify(message) + '\n';
|
||||
|
||||
return {requests};
|
||||
});
|
||||
});
|
||||
|
||||
WebSocketInterceptor.setOnCloseCallback((socketId, message) => {
|
||||
@@ -254,8 +266,13 @@ class NetworkOverlay extends React.Component<
|
||||
if (socketIndex === undefined) {
|
||||
return;
|
||||
}
|
||||
this._requests[socketIndex].serverClose = message;
|
||||
this._genDetailViewItem(socketIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[socketIndex];
|
||||
networkRequestInfo.serverClose = message;
|
||||
|
||||
return {requests};
|
||||
});
|
||||
});
|
||||
|
||||
WebSocketInterceptor.setOnErrorCallback((socketId, message) => {
|
||||
@@ -263,8 +280,13 @@ class NetworkOverlay extends React.Component<
|
||||
if (socketIndex === undefined) {
|
||||
return;
|
||||
}
|
||||
this._requests[socketIndex].serverError = message;
|
||||
this._genDetailViewItem(socketIndex);
|
||||
|
||||
this.setState(({requests}) => {
|
||||
const networkRequestInfo = requests[socketIndex];
|
||||
networkRequestInfo.serverError = message;
|
||||
|
||||
return {requests};
|
||||
});
|
||||
});
|
||||
|
||||
// Fire above callbacks.
|
||||
@@ -281,34 +303,30 @@ class NetworkOverlay extends React.Component<
|
||||
WebSocketInterceptor.disableInterception();
|
||||
}
|
||||
|
||||
_renderRow(
|
||||
rowData: NetworkRequestInfo,
|
||||
sectionID: number,
|
||||
rowID: number,
|
||||
highlightRow: (sectionID: number, rowID: number) => void,
|
||||
): React.Element<any> {
|
||||
let urlCellViewStyle = styles.urlEvenCellView;
|
||||
let methodCellViewStyle = styles.methodEvenCellView;
|
||||
if (rowID % 2 === 1) {
|
||||
urlCellViewStyle = styles.urlOddCellView;
|
||||
methodCellViewStyle = styles.methodOddCellView;
|
||||
}
|
||||
_renderItem({item, index}): ?React.Element<any> {
|
||||
const tableRowViewStyle = [
|
||||
styles.tableRow,
|
||||
index % 2 === 1 ? styles.tableRowOdd : styles.tableRowEven,
|
||||
index === this.state.detailRowId && styles.tableRowPressed,
|
||||
];
|
||||
const urlCellViewStyle = styles.urlCellView;
|
||||
const methodCellViewStyle = styles.methodCellView;
|
||||
|
||||
return (
|
||||
<TouchableHighlight
|
||||
onPress={() => {
|
||||
this._pressRow(rowID);
|
||||
highlightRow(sectionID, rowID);
|
||||
this._pressRow(index);
|
||||
}}>
|
||||
<View>
|
||||
<View style={styles.tableRow}>
|
||||
<View style={tableRowViewStyle}>
|
||||
<View style={urlCellViewStyle}>
|
||||
<Text style={styles.cellText} numberOfLines={1}>
|
||||
{rowData.url}
|
||||
{item.url}
|
||||
</Text>
|
||||
</View>
|
||||
<View style={methodCellViewStyle}>
|
||||
<Text style={styles.cellText} numberOfLines={1}>
|
||||
{this._getTypeShortName(rowData.type)}
|
||||
{this._getTypeShortName(item.type)}
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
@@ -317,62 +335,63 @@ class NetworkOverlay extends React.Component<
|
||||
);
|
||||
}
|
||||
|
||||
_renderSeperator(
|
||||
sectionID: number,
|
||||
rowID: number,
|
||||
adjacentRowHighlighted: boolean,
|
||||
): React.Element<any> {
|
||||
_renderItemDetail(id) {
|
||||
const requestItem = this.state.requests[id];
|
||||
const details = Object.keys(requestItem).map(key => {
|
||||
if (key === 'id') {
|
||||
return;
|
||||
}
|
||||
return (
|
||||
<View style={styles.detailViewRow} key={key}>
|
||||
<Text style={[styles.detailViewText, styles.detailKeyCellView]}>
|
||||
{key}
|
||||
</Text>
|
||||
<Text style={[styles.detailViewText, styles.detailValueCellView]}>
|
||||
{this._getStringByValue(requestItem[key])}
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<View
|
||||
key={`${sectionID}-${rowID}`}
|
||||
style={{
|
||||
height: adjacentRowHighlighted ? SEPARATOR_THICKNESS : 0,
|
||||
backgroundColor: adjacentRowHighlighted ? '#3B5998' : '#CCCCCC',
|
||||
}}
|
||||
/>
|
||||
<View>
|
||||
<TouchableHighlight
|
||||
style={styles.closeButton}
|
||||
onPress={this._closeButtonClicked}>
|
||||
<View>
|
||||
<Text style={styles.closeButtonText}>v</Text>
|
||||
</View>
|
||||
</TouchableHighlight>
|
||||
<ScrollView
|
||||
style={styles.detailScrollView}
|
||||
ref={this._captureDetailScrollView}>
|
||||
{details}
|
||||
</ScrollView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
_scrollToBottom(): void {
|
||||
if (this._listView) {
|
||||
const scrollResponder = this._listView.getScrollResponder();
|
||||
if (scrollResponder) {
|
||||
const scrollY = Math.max(
|
||||
this._requests.length * LISTVIEW_CELL_HEIGHT +
|
||||
(this._listViewHighlighted ? 2 * SEPARATOR_THICKNESS : 0) -
|
||||
this._listViewHeight,
|
||||
0,
|
||||
);
|
||||
scrollResponder.scrollResponderScrollTo({
|
||||
x: 0,
|
||||
y: scrollY,
|
||||
animated: true,
|
||||
});
|
||||
}
|
||||
_scrollRequestsToBottom(): void {
|
||||
if (this._requestsListView) {
|
||||
this._requestsListView.scrollToEnd();
|
||||
}
|
||||
}
|
||||
|
||||
_captureRequestListView(listRef: ?ListView): void {
|
||||
this._listView = listRef;
|
||||
}
|
||||
|
||||
_listViewOnLayout(event: any): void {
|
||||
const {height} = event.nativeEvent.layout;
|
||||
this._listViewHeight = height;
|
||||
_captureRequestsListView(listRef: ?FlatList<NetworkRequestInfo>): void {
|
||||
this._requestsListView = listRef;
|
||||
}
|
||||
|
||||
/**
|
||||
* Popup a scrollView to dynamically show detailed information of
|
||||
* the request, when pressing a row in the network flow listView.
|
||||
*/
|
||||
_pressRow(rowID: number): void {
|
||||
this._listViewHighlighted = true;
|
||||
this.setState({detailRowID: rowID}, this._scrollToTop());
|
||||
_pressRow(rowId: number): void {
|
||||
this.setState({detailRowId: rowId}, this._scrollDetailToTop());
|
||||
}
|
||||
|
||||
_scrollToTop(): void {
|
||||
if (this._scrollView) {
|
||||
this._scrollView.scrollTo({
|
||||
_scrollDetailToTop(): void {
|
||||
if (this._detailScrollView) {
|
||||
this._detailScrollView.scrollTo({
|
||||
y: 0,
|
||||
animated: false,
|
||||
});
|
||||
@@ -380,11 +399,11 @@ class NetworkOverlay extends React.Component<
|
||||
}
|
||||
|
||||
_captureDetailScrollView(scrollRef: ?ScrollView): void {
|
||||
this._scrollView = scrollRef;
|
||||
this._detailScrollView = scrollRef;
|
||||
}
|
||||
|
||||
_closeButtonClicked() {
|
||||
this.setState({detailRowID: null});
|
||||
this.setState({detailRowId: null});
|
||||
}
|
||||
|
||||
_getStringByValue(value: any): string {
|
||||
@@ -424,58 +443,18 @@ class NetworkOverlay extends React.Component<
|
||||
return '';
|
||||
}
|
||||
|
||||
/**
|
||||
* Generate a list of views containing network request information for
|
||||
* a XHR object, to be shown in the detail scrollview. This function
|
||||
* should be called every time there is a new update of the XHR object,
|
||||
* in order to show network request/response information in real time.
|
||||
*/
|
||||
_genDetailViewItem(index: number): void {
|
||||
this._detailViewItems[index] = [];
|
||||
const detailViewItem = this._detailViewItems[index];
|
||||
const requestItem = this._requests[index];
|
||||
for (let key in requestItem) {
|
||||
detailViewItem.push(
|
||||
<View style={styles.detailViewRow} key={key}>
|
||||
<Text style={[styles.detailViewText, styles.detailKeyCellView]}>
|
||||
{key}
|
||||
</Text>
|
||||
<Text style={[styles.detailViewText, styles.detailValueCellView]}>
|
||||
{this._getStringByValue(requestItem[key])}
|
||||
</Text>
|
||||
</View>,
|
||||
);
|
||||
}
|
||||
// Re-render if this network request is showing in the detail view.
|
||||
if (
|
||||
this.state.detailRowID != null &&
|
||||
Number(this.state.detailRowID) === index
|
||||
) {
|
||||
this.setState({newDetailInfo: true});
|
||||
}
|
||||
_keyExtractor(request: NetworkRequestInfo): string {
|
||||
return String(request.id);
|
||||
}
|
||||
|
||||
render() {
|
||||
const {requests, detailRowId} = this.state;
|
||||
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
{this.state.detailRowID != null && (
|
||||
<TouchableHighlight
|
||||
style={styles.closeButton}
|
||||
onPress={this._closeButtonClicked}>
|
||||
<View>
|
||||
<Text style={styles.clostButtonText}>v</Text>
|
||||
</View>
|
||||
</TouchableHighlight>
|
||||
)}
|
||||
{this.state.detailRowID != null && (
|
||||
<ScrollView
|
||||
style={styles.detailScrollView}
|
||||
ref={this._captureDetailScrollView}>
|
||||
{this._detailViewItems[this.state.detailRowID]}
|
||||
</ScrollView>
|
||||
)}
|
||||
{detailRowId != null && this._renderItemDetail(detailRowId)}
|
||||
<View style={styles.listViewTitle}>
|
||||
{this._requests.length > 0 && (
|
||||
{requests.length > 0 && (
|
||||
<View style={styles.tableRow}>
|
||||
<View style={styles.urlTitleCellView}>
|
||||
<Text style={styles.cellText} numberOfLines={1}>
|
||||
@@ -490,15 +469,14 @@ class NetworkOverlay extends React.Component<
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
<ListView
|
||||
|
||||
<FlatList
|
||||
ref={this._captureRequestsListView}
|
||||
style={styles.listView}
|
||||
ref={this._captureRequestListView}
|
||||
dataSource={this.state.dataSource}
|
||||
renderRow={this._renderRow}
|
||||
enableEmptySections={true}
|
||||
renderSeparator={this._renderSeperator}
|
||||
// $FlowFixMe Found when typing ListView
|
||||
onLayout={this._listViewOnLayout}
|
||||
data={requests}
|
||||
renderItem={this._renderItem}
|
||||
keyExtractor={this._keyExtractor}
|
||||
extraData={this.state}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
@@ -522,6 +500,16 @@ const styles = StyleSheet.create({
|
||||
tableRow: {
|
||||
flexDirection: 'row',
|
||||
flex: 1,
|
||||
height: LISTVIEW_CELL_HEIGHT,
|
||||
},
|
||||
tableRowEven: {
|
||||
backgroundColor: '#555',
|
||||
},
|
||||
tableRowOdd: {
|
||||
backgroundColor: '#000',
|
||||
},
|
||||
tableRowPressed: {
|
||||
backgroundColor: '#3B5998',
|
||||
},
|
||||
cellText: {
|
||||
color: 'white',
|
||||
@@ -550,41 +538,20 @@ const styles = StyleSheet.create({
|
||||
flex: 5,
|
||||
paddingLeft: 3,
|
||||
},
|
||||
methodOddCellView: {
|
||||
methodCellView: {
|
||||
height: 15,
|
||||
borderColor: '#DCD7CD',
|
||||
borderRightWidth: 1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#000',
|
||||
flex: 1,
|
||||
},
|
||||
urlOddCellView: {
|
||||
urlCellView: {
|
||||
height: 15,
|
||||
borderColor: '#DCD7CD',
|
||||
borderLeftWidth: 1,
|
||||
borderRightWidth: 1,
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#000',
|
||||
flex: 5,
|
||||
paddingLeft: 3,
|
||||
},
|
||||
methodEvenCellView: {
|
||||
height: 15,
|
||||
borderColor: '#DCD7CD',
|
||||
borderRightWidth: 1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#888',
|
||||
flex: 1,
|
||||
},
|
||||
urlEvenCellView: {
|
||||
height: 15,
|
||||
borderColor: '#DCD7CD',
|
||||
borderLeftWidth: 1,
|
||||
borderRightWidth: 1,
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#888',
|
||||
flex: 5,
|
||||
paddingLeft: 3,
|
||||
},
|
||||
@@ -608,7 +575,7 @@ const styles = StyleSheet.create({
|
||||
color: 'white',
|
||||
fontSize: 11,
|
||||
},
|
||||
clostButtonText: {
|
||||
closeButtonText: {
|
||||
color: 'white',
|
||||
fontSize: 10,
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user