主頁 > 作業系統 > 如何強制用戶回答在Flutter中打開應用程式的問題?

如何強制用戶回答在Flutter中打開應用程式的問題?

2021-12-27 05:18:30 作業系統

我有一個 Flutter 應用程式,我想添加一個在打開應用程式時出現的頁面,要求用戶回答一個問題,例如世界上有多少個國家 - 答案已經存盤在應用程式中,以便如果答案正確, 答案被存盤,應用程式打開,此頁面不再出現,但如果答案錯誤,用戶仍留在此頁面上,他無法打開應用程式,直到他寫出正確的答案 任何有用的建議或示例?

更新:我創建了以下驗證頁面,用于檢查輸入的文本是否等于存盤的文本,如果為真,我使用flutter_secure_storage存盤文本現在我想知道如何將shared_preferences添加到我的代碼中?

class check extends StatefulWidget {
  @override
  _checkState createState() => _checkState();
}

class _checkState extends State<check> {

  final formKey = GlobalKey<FormState>();
  final verifierController = TextEditingController();
  String storedvalue = '200';
 

  @override
  void initState() {
    super.initState();
    init();
  }

  Future init() async {
    final realcode = await UserSecureStorage.getCodestored() ?? '';

    setState(() {
      this.verifierController.text = realcode;
    });
  }

  Codecheck() async {
    await UserSecureStorage.setUsername(verifierController.text);

    if (storedvalue == verifierController.text) {
      Navigator.of(context).pushReplacementNamed('/homeScreen');
    }
    else  {
    
      Navigator.of(context).pushReplacementNamed('/checkScreen');
    }

  }

  @override
  Widget build(BuildContext context) {
  return Scaffold(
        body: Padding(
          padding: const EdgeInsets.all(10),
          child: Center(
              child: Stack(
            children: [
           Align(
                  child: Text(
                    'how many countries are there in the world?',
            .........
                ),
                Align(
                    child: TextFormField(
                      .......
                      controller: verifierController,
                    
                    )),
                Align(
                    child: RaisedButton(
                     .........
                        onPressed: () async {
                            Codecheck();
                          },
                       ..........

uj5u.com熱心網友回復:

您將檢查用戶的答案,如果正確,則在共享首選項中保存一個布林值,然后導航到應用程式主頁,每次打開應用程式時,您都會從共享首選項中檢查此布林值,如果為真,則不要t顯示問題,直接打開首頁,如果沒有,再顯示問題

uj5u.com熱心網友回復:

以一種非常簡單的方式,您可以使用SharedPreferences插件永久存盤您的問題的答案,例如

您可以存盤一個“問題”鍵,該鍵的值為“世界上有多少個國家? ”(可選)。您還存盤了一個值為“ 324的“ answer ”鍵(世界上確切的國家數量)

然后你創建一個“ answer_found ”鍵,它將是一個布林值,如果是或否用戶正確回答問題,它將更新。

然后當應用程式啟動時,您將首先查詢“ answer_found ”鍵以查看其值是否為True

如果該值為True,則不顯示問卷頁面,如果值為 false 或 null ,則顯示問卷頁面。

當用戶輸入答案時,只需將他的答案與首選項中答案”鍵中包含的答案進行比較如果正確,只需更新鍵“ answer_found ”即可。在相反的情況下什么都不做(或你想要的)

更新: 正如您所問,這里是代碼的摘錄。我把它做得盡可能簡單(雖然有點野蠻),這樣你就可以盡可能地理解這個機制,并且你可以隨心所欲地調整它。

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await SharedPreferences.getInstance().then((preferences) async {
    //Optional key (and can put want you want)
    //Store the question in preferences
    await preferences.setString('question', 'how many countries are there in the world?');

    //Store the answer
    await preferences.setInt('answer', 324);
  });

  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool? questionAnswered;

  @override
  void initState() {
    super.initState();
    _getQuestionState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: home,
    );
  }

  Widget get home {
    if (questionAnswered == null) {
      return const Scaffold(body: Center(child: CircularProgressIndicator()));
    } else if (questionAnswered!) {
      return const HomePage();
    } else {
      return const QuestionPage();
    }
  }

  Future<void> _getQuestionState() async {
    final preferences = await SharedPreferences.getInstance();

    //obtaining the present value of 'answer_found' to know if the question has been answered (with a correct answer)
    final isQuestionAnswered = preferences.getBool('answer_found') ??
        false; //if the value is null, we set it to false (to avoid a NullException)

    setState(() => questionAnswered = isQuestionAnswered);
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(
          title: const Text('Home Page'),
        ),
        body: const Center(
          child: Text('WELCOME'),
        ),
      );
}

class QuestionPage extends StatefulWidget {
  const QuestionPage({Key? key}) : super(key: key);

  @override
  State<QuestionPage> createState() => _QuestionPageState();
}

class _QuestionPageState extends State<QuestionPage> {
  late final TextEditingController _answerTextController;

  @override
  void initState() {
    super.initState();

    _answerTextController = TextEditingController();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 20.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            const Text('how many countries are there in the world?'),
            TextField(
              controller: _answerTextController,
              decoration: const InputDecoration(hintText: 'Enter answer'),
            ),
            ElevatedButton(
                onPressed: () async {
                  //Convert the user's response to be in an integer type (because we want to make a comparison with an integer)
                  //The user's response will be null, if the user has not entered an integer
                  final userAnswer = int.tryParse(_answerTextController.text);

                  if (userAnswer != null) {
                    final preferences = await SharedPreferences.getInstance();

                    final storedAnswer = preferences.getInt('answer')!;

                    if (userAnswer == storedAnswer) {
                      preferences.setBool('answer_found', true);

                      Navigator.pushReplacement(context, MaterialPageRoute(builder: (context) => const HomePage()));
                    } else {
                      //Notify user that his answer was wrong or do some stuff (what you want)
                    }
                  } else {
                    //Do some stuff
                  }
                },
                child: const Text('Validate')),
          ],
        ),
      ),
    );
  }
}

我從未使用過 flutter_secure_storage 插件,但是按照我為您制作的代碼片段,我認為您可以重新調整它以使用 flutter_secure 存盤,推理和邏輯是相同的。

PS:您不必同時使用 shared_preferences 和 flutter_secure_storage 。您可以簡單地使用 flutter_secure_storage ,與 shared_preferences 不同,它為您提供安全的存盤空間(如其名稱所示),您只需實作相同的邏輯。

uj5u.com熱心網友回復:

我希望您將啟影片面作為要加載到應用程式中的第一個螢屏。

現在,當第一個螢屏將加載時。使第一個螢屏成為有狀態的。

這將允許您使用“initstate”方法。并且您知道將首先呼叫 initstate 方法來執行代碼。


initstate(){
 /// in this case I am using "get_storage" to store the data in local.
 GetStorage prefs = GetStorage("ApplicationName");
 bool isAnswered = prefs.read("isAnsweredQuestion") ?? false;
 if(isAnswered){
  /// redirect to the other screen.
 }else{
  /// redirect to the screen where you have the questions
  /// or open the dialog having questions.
 }
 super.initstate();
};

initstate 方法將在應用程式加載并執行啟影片面時第一次執行,并將檢查本地資料存盤。

如果用戶是第一次打開應用程式,那么本地資料將為空,我們使用空檢查運算子來處理它。

如果用戶已經回答了問題,那么我們將在本地存盤“true”。在這種情況下,我們會將用戶重定向到另一個螢屏。

轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/393796.html

標籤:

上一篇:在容器顫動時制作漸變效果,

下一篇:使用flutter_switch包的可重用SwitchWidget

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • CA和證書

    1、在 CentOS7 中使用 gpg 創建 RSA 非對稱密鑰對 gpg --gen-key #Centos上生成公鑰/密鑰對(存放在家目錄.gnupg/) 2、將 CentOS7 匯出的公鑰,拷貝到 CentOS8 中,在 CentOS8 中使用 CentOS7 的公鑰加密一個檔案 gpg -a ......

    uj5u.com 2020-09-10 00:09:53 more
  • Kubernetes K8S之資源控制器Job和CronJob詳解

    Kubernetes的資源控制器Job和CronJob詳解與示例 ......

    uj5u.com 2020-09-10 00:10:45 more
  • VMware下安裝CentOS

    VMware下安裝CentOS 一、軟硬體準備 1 Centos鏡像準備 1.1 CentOS鏡像下載地址 下載地址 1.2 CentOS鏡像下載程序 點擊下載地址進入如下圖的網站,選擇需要下載的版本,這里選擇的是Centos8,點擊如圖所示。 決定選擇Centos8后,選擇想要的鏡像源進行下載,此 ......

    uj5u.com 2020-09-10 00:12:10 more
  • 如何使用Grep命令查找多個字串

    如何使用Grep 命令查找多個字串 大家好,我是良許! 今天向大家介紹一個非常有用的技巧,那就是使用 grep 命令查找多個字串。 簡單介紹一下,grep 命令可以理解為是一個功能強大的命令列工具,可以用它在一個或多個輸入檔案中搜索與正則運算式相匹配的文本,然后再將每個匹配的文本用標準輸出的格式 ......

    uj5u.com 2020-09-10 00:12:28 more
  • git配置http代理

    git配置http代理 經常遇到克隆 github 慢的問題,這里記錄一下幾種配置 git 代理的方法,解決 clone github 過慢。 目錄 git配置代理 git單獨配置github代理 git配置全域代理 配置終端環境變數 git配置代理 主要使用 git config 命令 git單獨 ......

    uj5u.com 2020-09-10 00:12:33 more
  • Linux npm install 裝包時提示Error EACCES permission denied解

    npm install 裝包時提示Error EACCES permission denied解決辦法 ......

    uj5u.com 2020-09-10 00:12:53 more
  • Centos 7下安裝nginx,使用yum install nginx,提示沒有可用的軟體包

    Centos 7下安裝nginx,使用yum install nginx,提示沒有可用的軟體包。 18 (flaskApi) [root@67 flaskDemo]# yum -y install nginx 19 已加載插件:fastestmirror, langpacks 20 Loading ......

    uj5u.com 2020-09-10 00:13:13 more
  • Linux查看服務器暴力破解ssh IP

    在公網的服務器上經常遇到別人爆破你服務器的22埠,用來挖礦或者干其他嘿嘿嘿的事情~ 這種情況下正確的做法是: 修改默認ssh的22埠 使用設定密鑰登錄或者白名單ip登錄 建議服務器密碼為復雜密碼 創建普通用戶登錄服務器(root權限過大) 建立堡壘機,實作統一管理服務器 統計爆破IP [root ......

    uj5u.com 2020-09-10 00:13:17 more
  • CentOS 7系統常見快捷鍵操作方式

    Linux系統中一些常見的快捷方式,可有效提高操作效率,在某些時刻也能避免操作失誤帶來的問題。 ......

    uj5u.com 2020-09-10 00:13:31 more
  • CentOS 7作業系統目錄結構介紹

    作業系統存在著大量的資料檔案資訊,相應檔案資訊會存在于系統相應目錄中,為了更好的管理資料資訊,會將系統進行一些目錄規劃,不同目錄存放不同的資源。 ......

    uj5u.com 2020-09-10 00:13:35 more
最新发布
  • vim的常用命令

    Vim的6種基本模式 1. 普通模式在普通模式中,用的編輯器命令,比如移動游標,洗掉文本等等。這也是Vim啟動后的默認模式。這正好和許多新用戶期待的操作方式相反(大多數編輯器默認模式為插入模式)。 2. 插入模式在這個模式中,大多數按鍵都會向文本緩沖中插入文本。大多數新用戶希望文本編輯器編輯程序中一 ......

    uj5u.com 2023-04-20 08:43:21 more
  • vim的常用命令

    Vim的6種基本模式 1. 普通模式在普通模式中,用的編輯器命令,比如移動游標,洗掉文本等等。這也是Vim啟動后的默認模式。這正好和許多新用戶期待的操作方式相反(大多數編輯器默認模式為插入模式)。 2. 插入模式在這個模式中,大多數按鍵都會向文本緩沖中插入文本。大多數新用戶希望文本編輯器編輯程序中一 ......

    uj5u.com 2023-04-20 08:42:36 more
  • docker學習

    ###Docker概述 真實專案部署環境可能非常復雜,傳統發布專案一個只需要一個jar包,運行環境需要單獨部署。而通過Docker可將jar包和相關環境(如jdk,redis,Hadoop...)等打包到docker鏡像里,將鏡像發布到Docker倉庫,部署時下載發布的鏡像,直接運行發布的鏡像即可。 ......

    uj5u.com 2023-04-19 09:26:53 more
  • 設定Windows主機的瀏覽器為wls2的默認瀏覽器

    這里以Chrome為例。 1. 準備作業 wsl是可以使用Windows主機上安裝的exe程式,出于安全考慮,默認情況下改功能是無法使用。要使用的話,終端需要以管理員權限啟動。 我這里以Windows Terminal為例,介紹如何默認使用管理員權限打開終端,具體操作如下圖所示: 2. 操作 wsl ......

    uj5u.com 2023-04-19 09:25:49 more
  • docker學習

    ###Docker概述 真實專案部署環境可能非常復雜,傳統發布專案一個只需要一個jar包,運行環境需要單獨部署。而通過Docker可將jar包和相關環境(如jdk,redis,Hadoop...)等打包到docker鏡像里,將鏡像發布到Docker倉庫,部署時下載發布的鏡像,直接運行發布的鏡像即可。 ......

    uj5u.com 2023-04-19 09:19:04 more
  • Linux學習筆記

    IP地址和主機名 IP地址 ifconfig可以用來查詢本機的IP地址,如果不能使用,可以通過install net-tools安裝。 Centos系統下ens33表示主網卡;inet后表示IP地址;lo表示本地回環網卡; 127.0.0.1表示代指本機;0.0.0.0可以用于代指本機,同時在放行設 ......

    uj5u.com 2023-04-18 06:52:01 more
  • 解決linux系統的kdump服務無法啟動的問題

    問題:專案麒麟系統服務器的kdump服務無法啟動,沒有相關日志無法定位問題。 1、查看服務狀態是關閉的,重啟系統也無法啟動 systemctl status kdump 2、修改grub引數,修改“crashkernel”為“512M(有的機器數值太大太小都會導致報錯,建議從128M開始試,或者加個 ......

    uj5u.com 2023-04-12 09:59:50 more
  • 解決linux系統的kdump服務無法啟動的問題

    問題:專案麒麟系統服務器的kdump服務無法啟動,沒有相關日志無法定位問題。 1、查看服務狀態是關閉的,重啟系統也無法啟動 systemctl status kdump 2、修改grub引數,修改“crashkernel”為“512M(有的機器數值太大太小都會導致報錯,建議從128M開始試,或者加個 ......

    uj5u.com 2023-04-12 09:59:01 more
  • 你是不是暴露了?

    作者:袁首京 原創文章,轉載時請保留此宣告,并給出原文連接。 如果您是計算機相關從業人員,那么應該經歷不止一次網路安全專項檢查了,你肯定是收到過資訊系統技術檢測報告,要求你加強風險監測,確保你提供的系統服務堅實可靠了。 沒檢測到問題還好,檢測到問題的話,有些處理起來還是挺麻煩的,尤其是線上正在運行的 ......

    uj5u.com 2023-04-05 16:52:56 more
  • 細節拉滿,80 張圖帶你一步一步推演 slab 記憶體池的設計與實作

    1. 前文回顧 在之前的幾篇記憶體管理系列文章中,筆者帶大家從宏觀角度完整地梳理了一遍 Linux 記憶體分配的整個鏈路,本文的主題依然是記憶體分配,這一次我們會從微觀的角度來探秘一下 Linux 內核中用于零散小記憶體塊分配的記憶體池 —— slab 分配器。 在本小節中,筆者還是按照以往的風格先帶大家簡單 ......

    uj5u.com 2023-04-05 16:44:11 more