cannot use custom font from local file

@iou90

Hello ! I am using your library on ios

I have this component

import React,{Component} from 'react';
import {View,ActivityIndicator,Dimensions} from 'react-native';
import AutoHeightWebView from 'react-native-autoheight-webview';

class DynamicWebView extends Component
    {
        constructor(props)
            {
                super(props);
                this.state = 
                    {
                        height: 0
                    }
                this.mycontext = this.props.context;
            }
        onWebViewMessage = (size) =>
            {
                if(size.height > 0)
                    {
                        this.mycontext.setState({height: parseInt(size.height)});
                        this.setState({height: parseInt(size.height)})
                    }
            }
        render()
            {
                let wrapperStyle = this.props.wrapperStyle || " style='direction:rtl;font-size: 19px;font-family: ae_AlArabiya;color: #666666;padding: 7px;'";
                let content = this.props.content || '';
                let style = this.props.style || {};
                let height = this.state.height && parseInt(this.state.height)>=0?this.state.height:200;
                let css = `<style type="text/css"> @font-face {font-family: ae_AlArabiya; src:url(file:///assets/fonts/ae_AlArabiya.ttf);} *{font-family: ae_AlArabiya}</style>`;
                return(<AutoHeightWebView
                    style={[{ width: Dimensions.get('window').width, marginTop: 35,backgroundColor: '#ffffff'},style]}
                    customStyle={`@font-face {font-family: ae_AlArabiya;src:url(file:///assets/fonts/ae_AlArabiya.ttf);} * {font-family: ae_AlArabiya;}`}
                    onSizeUpdated={(size) => {this.onWebViewMessage(size);}}
                    source={{html:  css + "<div" + wrapperStyle + ">"+ content + "</div>"}}
                    zoomable={false}
                    baseUrl=""
                    startInLoadingState={true}
                    renderLoading={() => <ActivityIndicator />}
                    />);
            }
    }
export default DynamicWebView;

i tried all ways to make my webview use font ae_AlArabiya but without any success.

Note : This was succeeded for normal react-native -webview

I attached a zip file that contains the font

Hope that their is any solution

Thank you in advance for any regards !

ae_AlArabiya.ttf.zip

[iou90]

@tapannathvani @sislovesmedotcom Now the local custom font example is included within the demo.

[lamaj411]

anybody can share some example code here, i checked the demo, but i cant understand bcz i am not an expert, please help me…