標籤用於在應用中實現多頁檢視。標籤通常放置在螢幕頂部或底部。一些庫允許在移動應用中建立標籤。標籤可以使用圖示代替文字型別的標籤。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例使用來自 '@react-navigation/material-bottom-tabs' 的 createMaterialBottomTabNavigator 來建立標籤，然後將其渲染為標籤。在另一個示例中，使用 Ionicons 中的圖示來建立標籤，然後將其渲染到裝置螢幕上。演算法 1 步驟 ... 閱讀更多

音訊是移動應用程式的常見元件。音訊可以在應用程式中以多種方式使用。音訊可以選擇自手機，可以使用任何線上連結，或者可以作為本地音訊包含在專案本身中。Expo-av 可用於將聲音整合到移動應用程式的所有這些情況下。在這篇文章中，展示了帶有三個不同示例的 React Native 和 Javascript 程式碼，第一個示例是從裝置瀏覽音訊檔案。在第二個示例中，音訊來自線上連結並混合了…… 閱讀更多

有時，任務是顯示一個帶有某些文字、圖片或顏色的小的邊界區域，並稍後從中檢索更多資訊或在選擇該專案時執行某些操作。為此，可以使用來自 react-native-paper 的 Card。螢幕上也可以使用多個 Card，將其作為列表項整合，並且可以使其可點選。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例是在應用程式中使用帶有影像的單個卡片，在第二個示例中，使用了多個卡片…… 閱讀更多

標籤用於在應用中實現多頁檢視。標籤通常放置在螢幕頂部或底部。一些庫允許在移動應用中建立標籤。也可以使用簡單的元件（如按鈕）來建立標籤。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例使用按鈕來建立標籤。在另一個示例中，使用來自 '@react-navigation/material-top-tabs' 的 createMaterialTopTabNavigator 來建立標籤，然後將其渲染到裝置螢幕上。演算法 1 步驟 1 − 匯入 Text、View、StyleSheet…… 閱讀更多

文字轉語音是一個重要的領域，其中書面語言文字被轉換為語音形式。要使用文字轉語音轉換，可以使用 expo-speech 中的功能。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例在顯示文字轉語音轉換的同時，展示了音調和速度的變化以及原始轉換。在第二個示例中，演示了暫停、恢復和停止方法，使用者也可以在轉換時輸入文字。演算法 1 步驟 1 − 匯入 Text、View、StyleSheet 和…… 閱讀更多

有時，任務是在給定範圍內遞增數字。為此，可以使用不同型別的滑塊。不同的庫允許在移動應用程式中使用滑塊。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例使用了“@react-native-community/slider”元件“Slider”。在另一個示例中，使用了名為 ArcSlider 的圓形滑塊（來自“rn-arc-slider”）來建立滑塊，然後將其渲染到裝置螢幕上。示例 1：使用來自 'react-native-community/slider' 的 Slider 來列印數字的表格。演算法步驟 1 − 匯入…… 閱讀更多

有時，任務是在應用程式中繪製基本形狀，例如線條、矩形、圓圈等。為此，可以使用來自 'react-native-svg' 的 Svg。在這篇文章中，展示了帶有四個不同示例的 React Native 和 Javascript 程式碼，第一個示例使用 'react-native-svg' 元件“Svg”和 Circle 來繪製圓圈，對其進行樣式化並顯示它們。在第二個示例中，以同心形式繪製不同樣式的圓圈。在第三個示例中，展示瞭如何製作可點選的圓圈。單擊此圓圈後，簡單的警報將顯示一條訊息。在…… 閱讀更多

有時，任務是從移動裝置中選擇影像，然後在應用程式中顯示這些影像。為此，可以使用 expo-image-picker 中的 ImagePicker。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例使用 React Native 元件“Image”來選擇影像、調整大小並顯示它。在另一個示例中，展示了從計算機或移動裝置選擇影像的方法，然後將其渲染到裝置螢幕上。示例 1：使用 React Native 調整大小並顯示影像…… 閱讀更多

有時，任務是將多個專案儲存和顯示為列表。為此，可以使用 React Native 元件 Flatlist。FlatList 也可以設定為可選擇或可點選。在這篇文章中，展示了帶有兩個不同示例的 React Native 和 Javascript 程式碼，第一個示例將列表項儲存為具有唯一 ID 的鍵值對陣列，然後進行提取和渲染。演算法 演算法 1 步驟 1 − 從 'react-native' 匯入 FlatList、Text 和 View。步驟 2 − 建立 App.js 並編寫儲存列表的程式碼。列表是…… 閱讀更多

在 React Native 應用程式中，通常需要多個螢幕。使用者需要從一個螢幕轉到另一個螢幕。在這篇文章中，使用了兩種不同的方法來建立雙屏應用程式，使用者可以在其中從一個螢幕轉到另一個螢幕，然後再返回。在示例 1 中，使用來自 'react-navigation' 的 createStackNavigator 模組來實現導航，而在示例 2 中，使用 createSwitchNavigator 來建立導航。演算法 演算法 1 步驟 1 − 從 'react-navigation' 匯入 createStackNavigator 步驟 2 − 建立 App.js 並編寫從一個螢幕導航到另一個螢幕的程式碼…… 閱讀更多