linux 文本中搜索字段_在swiftui中使用国家代码和标志创建电话号码文本字段-CSDN博客

linux 文本中搜索字段

We will present two methods of creating a phone number view that displays a country code and its flag. The first method contains a list of all the country codes for the user to pick. The second method will show the relevant flag whenever the user enters a valid country code.

我们将介绍两种创建显示国家代码及其标志的电话号码视图的方法。第一种方法包含所有国家/地区代码的列表，供用户选择。每当用户输入有效的国家/地区代码时，第二种方法将显示相关标志。

第一种方法 (First Method)

国家代码功能 (Country code functions)

Create a view struct that contains a dictionary of all the country codes we are going to have:

创建一个视图结构，其中包含我们将要拥有的所有国家(地区)代码的字典：

To have the full country name in your application, add the function below that takes in a country code and returns the full name:

要在您的应用程序中具有完整的国家名称，请在下面添加使用国家/地区代码并返回全名的函数：

To display the countries’ flags, add the function below that takes in a country code and returns its associated flag emoji:

要显示国家/地区的标志，请在下面添加使用国家/地区代码并返回其相关标志表情符号的函数：

国家代码用户界面 (Country code UI)

We need to have a list view. Pass the list our country codes dictionary sorted. Inside the list, we are going to have an HStack that contains text views for the country’s flag, name, and code. Add an onTapGesture that assigns the tapped row’s data to our binding variables. Having binding variables will help us get the picked row’s data to another struct view that we are creating next. To dismiss the view, we are going to offset the view’s y position. Create a binding y variable that will be changed when a row is tapped. Alternate y between half of the height of your list view and 0:

我们需要一个列表视图。通过清单将我们的国家代码字典排序。在列表中，我们将有一个HStack ，其中包含该国家的国旗，名称和代码的文本视图。添加一个onTapGesture ，将点击的行的数据分配给我们的绑定变量。拥有绑定变量将帮助我们将选取的行的数据获取到下一步要创建的另一个结构视图。要关闭视图，我们将偏移视图的y位置。创建一个绑定y变量，在点击一行时将更改它。在列表视图的一半高度与0之间交替y ：

电话号码TextField UI (Phone number TextField UI)

Create state variables for the country code and flag. Add the variable y that is going to be used to offset the view. The UI consists of an HStack that includes a text view and a text field. The text view uses an onTapGesture to offset y. Add the HStack inside a ZStack, then add our CountryCodes view under the HStack. Pass the country code and flag state variables along with the y variable to the CountryCodes view:

为国家代码和标志创建状态变量。添加将用于偏移视图的变量y 。 UI由包含文本视图和文本字段的HStack组成。文本视图使用onTapGesture偏移y 。添加HStack一个内部ZStack ，然后加入我们的CountryCodes下查看HStack 。将country code和flag状态变量以及y变量传递给CountryCodes视图：

phone number textfield, text field, country code swiftui, country flag swiftui, phone number swiftui

第二种方法 (Second Method)

电话号码TextField函数 (Phone number TextField functions)

Create a struct view and add the country codes dictionary constant we have above. We are going to use the same flag function we created before inside this struct view:

创建一个结构视图并添加我们上面具有的国家代码字典常量。我们将在此struct视图中使用之前创建的相同标志函数：

Create the function below to get the country code from the dictionary whenever the user enters the number. The function will get the country code and return the first key for the value that matches the given code:

每当用户输入数字时，创建以下函数即可从字典中获取国家/地区代码。该函数将获取国家/地区代码，并返回与给定代码匹配的值的第一个键：

电话号码TextField UI (Phone number TextField UI)

Create the function below to get the country code from the dictionary whenever the user enters the number. The function will take a country code and then return the first key in the dictionary that has a value that matches the given code:

每当用户输入数字时，创建以下函数即可从字典中获取国家/地区代码。该函数将使用国家/地区代码，然后返回字典中具有与给定代码匹配的值的第一个键：

If you look at the country codes dictionary, you will find that there are multiple countries with the same code. The application will return the first key it finds inside the dictionary. To avoid having the wrong flag, use the first method or allow the user to choose among the flags that have the same code.

如果您查看国家/地区代码字典，则会发现有多个国家/地区使用相同的代码。应用程序将返回在字典中找到的第一个键。为避免使用错误的标志，请使用第一种方法或允许用户在具有相同代码的标志中进行选择。

Thanks for reading.

谢谢阅读。