Improved planning display

This commit is contained in:
keplyx 2020-03-08 12:05:22 +01:00
parent 2e579368a8
commit 2f3e171b08
2 changed files with 25 additions and 24 deletions

View file

@ -6,7 +6,7 @@ import ThemeManager from "../utils/ThemeManager";
import HTML from "react-native-render-html";
import {Linking} from "expo";
import PlanningEventManager from '../utils/PlanningEventManager';
import {Subheading, Title} from 'react-native-paper';
import {Card} from 'react-native-paper';
type Props = {
navigation: Object,
@ -28,14 +28,12 @@ export default class PlanningDisplayScreen extends React.Component<Props> {
// console.log("rendering planningDisplayScreen");
return (
<ScrollView style={{paddingLeft: 5, paddingRight: 5}}>
<Title>
{this.displayData.title}
</Title>
<Subheading style={{marginTop: 10,}}>
{PlanningEventManager.getFormattedTime(this.displayData)}
</Subheading>
<Card.Title
title={this.displayData.title}
subtitle={PlanningEventManager.getFormattedTime(this.displayData) + ' | ' + PlanningEventManager.getEventStartDate(this.displayData)}
/>
{this.displayData.logo !== null ?
<View style={{width: '100%', height: 300, marginTop: 20, marginBottom: 20}}>
<View style={{width: '100%', height: 300}}>
<Image style={{flex: 1, resizeMode: "contain"}}
source={{uri: this.displayData.logo}}/>
</View>
@ -43,14 +41,14 @@ export default class PlanningDisplayScreen extends React.Component<Props> {
{this.displayData.description !== null ?
// Surround description with div to allow text styling if the description is not html
<Card.Content>
<HTML html={"<div>" + this.displayData.description + "</div>"}
tagsStyles={{
p: {
color: ThemeManager.getCurrentThemeVariables().text,
},
p: {color: ThemeManager.getCurrentThemeVariables().text,},
div: {color: ThemeManager.getCurrentThemeVariables().text}
}}
onLinkPress={openWebLink}/>
</Card.Content>
: <View/>}
</ScrollView>
);

View file

@ -1,13 +1,12 @@
// @flow
import * as React from 'react';
import {BackHandler, Image, View} from 'react-native';
import {BackHandler, View} from 'react-native';
import i18n from "i18n-js";
import ThemeManager from "../utils/ThemeManager";
import {LocaleConfig} from 'react-native-calendars';
import WebDataManager from "../utils/WebDataManager";
import PlanningEventManager from '../utils/PlanningEventManager';
import {Text, Title, List, Avatar, Divider} from 'react-native-paper';
import {Avatar, Divider, List} from 'react-native-paper';
import CustomAgenda from "../components/CustomAgenda";
LocaleConfig.locales['fr'] = {
@ -31,7 +30,7 @@ type State = {
const FETCH_URL = "https://amicale-insat.fr/event/json/list";
const AGENDA_MONTH_SPAN = 6;
const AGENDA_MONTH_SPAN = 3;
/**
* Class defining the app's planning screen
@ -138,7 +137,10 @@ export default class PlanningScreen extends React.Component<Props, State> {
<List.Item
title={item.title}
description={PlanningEventManager.getFormattedTime(item)}
left={props => <Avatar.Image source={{uri: item.logo}} />}
left={props => <Avatar.Image
source={{uri: item.logo}}
style={{backgroundColor: 'transparent'}}
/>}
onPress={onPress}
/>
</View>
@ -164,9 +166,10 @@ export default class PlanningScreen extends React.Component<Props, State> {
}
rowHasChanged(r1: Object, r2: Object) {
if (r1 !== undefined && r2 !== undefined)
return r1.title !== r2.title;
else return !(r1 === undefined && r2 === undefined);
return false;
// if (r1 !== undefined && r2 !== undefined)
// return r1.title !== r2.title;
// else return !(r1 === undefined && r2 === undefined);
}
/**