我正在使用Xamarin进行跨平台项目。现在,我陷入了API JSON数据,数据类和ListView的问题。
这是我的TideInfo类中的代码:
public class TideRoot {
[JsonProperty("EventType")]
public string EventType { get; set; } = string.Empty;
[JsonProperty("DateTime")]
public DateTime DateTime { get; set; }
[JsonProperty("IsApproximateTime")]
public bool IsApproximateTime { get; set; }
[JsonProperty("Height")]
public double Height { get; set; }
[JsonProperty("IsApproximateHeight")]
public bool IsApproximateHeight { get; set; }
[JsonProperty("Filtered")]
public bool Filtered { get; set; }
[JsonIgnore]
public string DisplayTide => $"Height: {EventType ?? string.Empty}, {Height}";
}
public class TideRootList {
public List<TideRoot> ListItem { get; set; } }
我使用json2csharp来获取TideRoot列表,并添加了DisplayTide,因此我可以在列表中同时显示EventType和Height。最近,我添加了TideRootList以获取有关潮汐7天信息的列表。
这是JSON文件:
[{
"EventType": "LowWater",
"DateTime": "2019-11-08T01:32:00",
"IsApproximateTime": false,
"Height": 1.8388111705145762,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-08T08:56:00",
"IsApproximateTime": false,
"Height": 4.2101062451792144,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-08T14:03:00",
"IsApproximateTime": false,
"Height": 1.7989273407141986,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-08T21:04:00",
"IsApproximateTime": false,
"Height": 4.070738079705702,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-09T02:16:00",
"IsApproximateTime": false,
"Height": 1.6184884034712226,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-09T09:34:00",
"IsApproximateTime": false,
"Height": 4.4085443850273309,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-09T14:44:00",
"IsApproximateTime": false,
"Height": 1.5501832117158008,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-09T21:44:00",
"IsApproximateTime": false,
"Height": 4.2701942634884968,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-10T02:56:00",
"IsApproximateTime": false,
"Height": 1.4077035385806112,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-10T10:09:00",
"IsApproximateTime": false,
"Height": 4.5597566246677248,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-10T15:20:00",
"IsApproximateTime": false,
"Height": 1.33459759647378,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-10T22:21:00",
"IsApproximateTime": false,
"Height": 4.4226776330873276,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-11T03:32:00",
"IsApproximateTime": false,
"Height": 1.2396397924330329,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-11T10:44:00",
"IsApproximateTime": false,
"Height": 4.6557658698506978,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-11T15:55:00",
"IsApproximateTime": false,
"Height": 1.1711223007079854,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-11T22:57:00",
"IsApproximateTime": false,
"Height": 4.5263662430387752,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-12T04:08:00",
"IsApproximateTime": false,
"Height": 1.1263357912996472,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-12T11:17:00",
"IsApproximateTime": false,
"Height": 4.7038380223666625,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-12T16:29:00",
"IsApproximateTime": false,
"Height": 1.0599435514996523,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-12T23:29:00",
"IsApproximateTime": false,
"Height": 4.5937485679887731,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-13T04:42:00",
"IsApproximateTime": false,
"Height": 1.0650050994934075,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-13T11:48:00",
"IsApproximateTime": false,
"Height": 4.7189203663268842,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-13T17:02:00",
"IsApproximateTime": false,
"Height": 0.99227216956188025,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-14T00:00:00",
"IsApproximateTime": false,
"Height": 4.6379169444371362,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-14T05:17:00",
"IsApproximateTime": false,
"Height": 1.0460921771289937,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "HighWater",
"DateTime": "2019-11-14T12:17:00",
"IsApproximateTime": false,
"Height": 4.7116384452230751,
"IsApproximateHeight": false,
"Filtered": false
}, {
"EventType": "LowWater",
"DateTime": "2019-11-14T17:36:00",
"IsApproximateTime": false,
"Height": 0.9624477944154356,
"IsApproximateHeight": false,
"Filtered": false
}]
这就是我处理API的方式:
public async Task<TideRootList> GetTideInfo(string id, string duration)
{
using (var client = new HttpClient())
{
// Request headers
client.DefaultRequestHeaders.Add("Ocp-Apim-Subscription-Key", "223604c97163487bb857cfb554c96c90");
var url = string.Format(TideInfo, id, duration);
var json = await client.GetStringAsync(url);
if (string.IsNullOrWhiteSpace(json))
return null;
json.Replace("[", "").Replace("]", "");
//deserialize the array into a list of Result objects, and take the object at index zero.
var result = JsonConvert.DeserializeObject<List<TideRootList>>(json);
return result[0];
}
}
最后一部分是执行API方法并将信息提供给XAML的viewModel。两者都在这里:
TideRootList tidelist;
public TideRootList TideList
{
get { return tidelist; }
set { tidelist = value; OnPropertyChanged(); }
}
TideList = await WeatherService.GetTideInfo("0065", "7");
还有XAML:
<StackLayout Padding="10" Spacing="10">
<ListView ItemsSource="{Binding TideRootList.ListItem}"
HasUnevenRows="True"
CachingStrategy="RecycleElement"
IsPullToRefreshEnabled="True"
RefreshCommand="{Binding GetWeatherCommand}"
IsRefreshing="{Binding IsBusy, Mode=OneWay}"
RowHeight="66"
x:Name="ListViewTide">
<ListView.SeparatorColor>
<OnPlatform x:TypeArguments="Color" iOS="Transparent"/>
</ListView.SeparatorColor>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal" Padding="10,0,0,0">
<StackLayout Padding="10" Spacing="5">
<Label Text="{Binding DisplayTide}"
TextColor="#3498db"
FontAttributes="Bold"
Style="{DynamicResource ListItemTextStyle}"/>
<Label Text="{Binding DisplayTide}"
Style="{DynamicResource ListItemDetailTextStyle}"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
经过许多不同的测试后,我无法在应用程序上显示DisplayTide,它只是一个空白。请告诉我我所缺少的。谢谢。
答案 0 :(得分:1)
您在ListView.ItemsSource
的bindind路径上错了。
应为TideList.ListItem
。
使用json反序列化时无需删除括号,您可以直接获取列表。
public async Task<List<TideRoot>> GetTideInfo(string id, string duration)
{
using (var client = new HttpClient())
{
// Request headers
client.DefaultRequestHeaders.Add("Ocp-Apim-Subscription-Key", "223604c97163487bb857cfb554c96c90");
var url = string.Format(TideInfo, id, duration);
var json = await client.GetStringAsync(url);
if (string.IsNullOrWhiteSpace(json))
return null;
//deserialize the array into a list of Result objects, and take the object at index zero.
var result = JsonConvert.DeserializeObject<List<TideRoot>>(json);
return result;
}
}
//in model
List<TideRoot> tidelist;
public List<TideRoot> TideList
{
get { return tidelist; }
set { tidelist = value; OnPropertyChanged(); }
}
TideList = await WeatherService.GetTideInfo("0065", "7");
//xaml
<ListView ItemsSource="{Binding TideList}"