首页 > 解决方案 > 全局更改字体大小的按钮

问题描述

我正在使用全局样式表和设置 js 文件。我希望应用程序用户能够根据自己的喜好从设置页面增加和减少全局字体大小。

以下是sharedStyles.js文件中的代码

//For Global Styling
import {
  StyleSheet,
  View
} from 'react-native'

//importing settings
import settings from '../screen_view/settings_page';


const sharedStyles = StyleSheet.create({

  description: {

    textAlign: 'center',

    //increase font size
    fontSize: settings.count,

    padding: 6,
    borderWidth: 2,
    borderColor: "black",
    backgroundColor: "lightcyan",


  }
})

export default sharedStyles;

下面是来自 settings.js 文件的代码

import React, {
  useState
} from "react";
import {
  View,
  Text,
  Button,
  StyleSheet
} from "react-native";

//Import Shared Styles
import sharedStyles from '../shared/sharedStyles';

const FontSize = () => {

  const [count, setCount] = useState(10);

  return (


    <
    View >

    <
    Text style = {
      sharedStyles.description.fontSize
    } > FONT SIZE < /Text>


    <
    Button title = "Increase Font Size"
    onPress = {
      () => {
        setCount(sharedStyles.description.fontSize.count + 5);
      }
    }
    />

    <
    /View>
  );
};

export default FontSize;

在设置页面中,我有一个增加全局字体大小的按钮,但它不起作用,请问我该如何使它起作用?

我想有 2 个按钮来增加和减少设置页面上的全局字体大小。

标签: javascriptcssreact-nativeexpo

解决方案


推荐阅读