Tenga en cuenta que este control ha quedado obsoleto y reemplazado con el componente Grid y, como tal, recomendamos migrar a ese control. Esto no recibirá ninguna característica nueva, las correcciones de errores no tendrán prioridad. Para obtener ayuda o preguntas sobre la migración de su código base a Data Grid, comuníquese con el soporte.
Blazor Grid Localization
La tabla de datos Ignite UI for Blazor / cuadrícula de datos admite la localización de las cadenas de recursos específicas de la ventana emergente de opciones de columna y los resúmenes. Tenga en cuenta que esto no está destinado a ser utilizado ni es capaz de traducir los datos.
Data Grid contiene SetCustomizedStringAsync
para asignar cadenas asociadas con las opciones de columna. La propiedad ActualDataSource
del grid también tiene este método para asignar cadenas de recursos necesarias para los resúmenes.
Ejemplo de localización de cuadrícula de Blazor
using System;
using System.Net.Http;
using System.Collections.Generic;
using System.Threading.Tasks;
using System.Text;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using IgniteUI.Blazor.Controls; // for registering Ignite UI modules
namespace Infragistics.Samples
{
public class Program
{
public static async Task Main(string[] args)
{
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("app");
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
// registering Ignite UI modules
builder.Services.AddIgniteUIBlazor(
typeof(IgbDataGridModule),
typeof(IgbGridColumnOptionsModule)
);
await builder.Build().RunAsync();
}
}
}
csusing System;
using System.Collections.Generic;
using System.Linq;
namespace Infragistics.Samples
{
public static class DataGeneratorJA
{
readonly static string[] websites = { ".com", ".gov", ".edu", ".org" };
readonly static string[] emails = { "gmail.com", "yahoo.com", "twitter.com" };
readonly static string[] genders = { "男", "女" };
readonly static string[] maleNames = { "カイル", "オスカー", "ラルフ", "マイク", "ビル", "フランク", "ハワード", "ジャック", "ラリー", "ピート", "スティーブ", "ヴィンス", "マーク", "アレックス", "マックス", "ブライアン", "クリス", "アンドリュー", "マーティン", "マイク", "スティーブ", "グレン", "ブルース" };
readonly static string[] femaleNames = { "ジーナ", "アイリーン", "ケイティー", "ブレンダ", "ケイシー", "フィオーナ", "ホリー", "ケイト", "リズ", "パメラ", "ネリー", "マルサ", "モニカ", "アンナ", "ジェシカ", "ソフィア", "イザベラ", "マーゴ", "ジェーン", "オードリー", "サリー", "メラニー", "グレタ", "オーロラ", "サリー" };
readonly static string[] lastNames = { "アダムス", "クローリー", "エリス", "マルチネス", "アーバイン", "マクスウェル", "クラーク", "オーエンス", "ルーニー", "リンカーン", "トーマス", "スペーシー", "モーガン", "キング", "ニュートン", "フィッツジェラルド", "ホームズ", "ジェファーソン", "ランドリー", "ベリー", "ペレス", "スペンサー", "スター", "カーター", "エドワーズ", "スターク", "ジョンソン", "フィッツ", "チーフ", "ブランク", "ペリー", "ストーン", "ウィリアムズ", "レーン", "ジョブズ", "アダムス", "パワー", "テスラ" };
readonly static string[] countries = { "アメリカ合衆国", "イギリス", "フランス", "カナダ", "ポーランド" };
readonly static string[] citiesUS = { "ニューヨーク", "ロサンゼルス", "マイアミ", "サンフランシスコ", "サンディエゴ", "ラスベガス" };
readonly static string[] citiesUK = { "ロンドン", "リバプール", "マンチェスター" };
readonly static string[] citiesFR = { "パリ", "マルセイユ", "リヨン" };
readonly static string[] citiesCA = { "トロント", "バンクーバー", "モントリオール" };
readonly static string[] citiesPL = { "クラクフ", "ワルシャワ", "ヴロツワフ", "グダニスク" };
readonly static string[] citiesJP = { "東京", "大阪", "京都", "横浜" };
readonly static string[] citiesGR = { "ベルリン", "ボン", "ケルン", "ミュンヘン", "ハンブルク" };
readonly static string[] roadSuffixes = { "通り", "通り", "通り" };
readonly static string[] roadNames = { "メイン", "ガーデン", "ブロード", "オーク", "シダー", "パーン", "パイン", "エルム", "マーケット", "ヒル" };
public static Random Rand = new Random();
public static string GetWebsite()
{
return GetItem(websites);
}
public static string GetEmail()
{
return GetItem(emails);
}
public static double GetNumber(double min, double max)
{
return Math.Round(min + (Rand.NextDouble() * (max - min)));
}
public static int GetInteger(double min, double max)
{
return (int)GetNumber(min, max);
}
public static string GetPhone()
{
var phoneCode = GetNumber(100, 900);
var phoneNum1 = GetNumber(100, 900);
var phoneNum2 = GetNumber(1000, 9000);
var phone = phoneCode + "-" + phoneNum1 + "-" + phoneNum2;
return phone;
}
public static string GetGender()
{
return GetItem(genders);
}
public static string GetNameFirst(string gender)
{
if (gender == "男")
return GetItem(maleNames);
else
return GetItem(femaleNames);
}
public static string GetNameLast()
{
return GetItem(lastNames);
}
public static string GetItem(string[] array)
{
var index = (int)Math.Round(GetNumber(0, array.Length - 1));
return array[index];
}
public static string GetCountry()
{
return GetItem(countries);
}
public static string GetCity(string country)
{
if (country == "カナダ")
{
return GetItem(citiesCA);
}
else if (country == "フランス")
{
return GetItem(citiesFR);
}
else if (country == "ポーランド")
{
return GetItem(citiesPL);
}
else if (country == "アメリカ合衆国")
{
return GetItem(citiesUS);
}
else if (country == "Japan")
{
return GetItem(citiesJP);
}
else if (country == "Germany")
{
return GetItem(citiesGR);
}
else
{
return GetItem(citiesUK);
}
}
public static string GetStreet()
{
var num = Math.Round(GetNumber(100, 300)).ToString();
var road = GetItem(roadNames);
var suffix = GetItem(roadSuffixes);
return num + " " + road + " " + suffix;
}
public static DateTime GetBirthday()
{
var year = DateTime.Now.Year - GetInteger(30, 50);
var month = GetNumber(10, 12);
var day = GetNumber(20, 27);
return new DateTime(year, (int)month, (int)day);
}
public static DateTime GetDate()
{
var year = DateTime.Now.Year;
var month = GetNumber(10, 12);
var day = GetNumber(20, 27);
return new DateTime(year, (int)month, (int)day);
}
public static string Pad(int num, int size)
{
var s = num + "";
while (s.Length < size)
{
s = "0" + s;
}
return s;
}
public static string GetPhotoMale(int id)
{
return "https://static.infragistics.com/xplatform/images/people/GUY" + Pad(id, 2) + ".png";
}
public static string GetPhotoFemale(int id)
{
return "https://static.infragistics.com/xplatform/images/people/GIRL" + Pad(id, 2) + ".png";
}
private static int maleCount = 0;
private static int femaleCount = 0;
public static string GetPhoto(string gender)
{
if (gender == "男")
{
maleCount++;
if (maleCount > 24) maleCount = 1;
return GetPhotoMale(maleCount);
}
else
{
femaleCount++;
if (femaleCount > 24) femaleCount = 1;
return GetPhotoFemale(femaleCount);
}
}
public static string GetGenderPhoto(string gender)
{
// Note: Mapping between En and Ja.
// This comment is for the sake of coding and debugging.
// readonly static string[] gendersEn = { "male", "female" };
// readonly static string[] genders = { "男", "女" };
string genderEn = (gender == "男" ? "male" : "female");
return "https://static.infragistics.com/xplatform/images/genders/" + genderEn + ".png";
}
public static string GetCountryFlag(string country)
{
// Note: Mapping between En and Ja.
// This comment is for the sake of coding and debugging.
// readonly static string[] countriesEn = { "USA", "UK", "France", "Canada", "Poland" };
// readonly static string[] countries = { "アメリカ合衆国", "イギリス", "フランス", "カナダ", "ポーランド" };
string countryEn = "";
if (country == "カナダ")
{
countryEn = "Canada";
}
else if (country == "フランス")
{
countryEn = "France";
}
else if (country == "ポーランド")
{
countryEn = "Poland";
}
else if (country == "アメリカ合衆国")
{
countryEn = "USA";
}
else if (country == "Japan")
{
countryEn = "Japan";
}
else if (country == "Germany")
{
countryEn = "Germany";
}
else
{ // if (country === "United Kingdom") {
countryEn = "UK";
}
return "https://static.infragistics.com/xplatform/images/flags/" + countryEn + ".png";
}
public static string GetIncomeRange(double salary)
{
if (salary < 50000)
{
return "低い";
}
else if (salary < 100000)
{
return "平均";
}
else
{
return "高い";
}
}
}
}
csusing System;
using System.Collections.Generic;
using System.ComponentModel;
namespace Infragistics.Samples
{
public class EmployeeJA : INotifyPropertyChanged
{
public string ID { get; set; }
public string Address { get; set; }
public double Age { get; set; }
public string Gender { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
public string Name { get; set; }
public string Street { get; set; }
public string City { get; set; }
public string Email { get; set; }
public string Phone { get; set; }
public string Photo { get; set; }
public double Salary { get; set; }
public double Sales { get; set; }
public string Income { get; set; }
public int Index { get; set; }
public DateTime Birthday { get; set; }
public List<ProductivityJA> Productivity { get; set; }
private string _Country;
public string Country
{
get { return _Country; }
set { if (_Country != value) { OnCountryChanged(value); } }
}
public string CountryFlag { get; set; }
protected void OnCountryChanged(string countryName)
{
// syncronizing country name and country flag
_Country = countryName;
CountryFlag = DataGeneratorJA.GetCountryFlag(countryName);
City = DataGeneratorJA.GetCity(countryName);
OnPropertyChanged("Country");
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}
public class ProductivityJA
{
public double Value { get; set; }
public int Week { get; set; }
}
public static class EmployeeDataJA
{
public static List<EmployeeJA> Create(int? count, bool? useProductivity)
{
if (count == null) count = 100;
var employees = new List<EmployeeJA>();
for (int i = 0; i < count; i++)
{
var age = Math.Round(DataGeneratorJA.GetNumber(20, 40));
var gender = DataGeneratorJA.GetGender();
var firstName = DataGeneratorJA.GetNameFirst(gender);
var lastName = DataGeneratorJA.GetNameLast();
var street = DataGeneratorJA.GetStreet();
var country = DataGeneratorJA.GetCountry();
var city = DataGeneratorJA.GetCity(country);
var email = firstName.ToLower() + "@" + DataGeneratorJA.GetEmail();
var photoPath = DataGeneratorJA.GetPhoto(gender);
var employee = new EmployeeJA
{
Index = i,
Address = street + ", " + city,
Age = age,
Birthday = DataGeneratorJA.GetBirthday(),
City = city,
Email = email,
Gender = gender,
ID = DataGeneratorJA.Pad(1001 + i, 4),
FirstName = firstName,
LastName = lastName,
Name = firstName + " " + lastName,
Photo = photoPath,
Phone = DataGeneratorJA.GetPhone(),
Street = DataGeneratorJA.GetStreet(),
Salary = DataGeneratorJA.GetNumber(40, 200) * 1000,
Sales = DataGeneratorJA.GetNumber(200, 980) * 1000,
};
employee.Country = country;
employee.Income = DataGeneratorJA.GetIncomeRange(employee.Salary);
if (useProductivity.HasValue && useProductivity.Value)
{
employee.Productivity = GetProductivity(52);
}
employees.Add(employee);
}
return employees;
}
public static List<ProductivityJA> GetProductivity(int weekCount)
{
var productivity = new List<ProductivityJA>();
for (var w = 1; w <= weekCount; w++)
{
var value = DataGeneratorJA.GetNumber(-50, 50);
var prod = new ProductivityJA
{
Value = value,
Week = w
};
productivity.Add(prod);
};
return productivity;
}
}
}
cs
@using Microsoft.AspNetCore.Components
@using Microsoft.AspNetCore.Components.Rendering
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.RenderTree
@using Microsoft.AspNetCore.Components.Web
@inject HttpClient Http
@using IgniteUI.Blazor.Controls
<div class="container vertical">
@if (Employees != null)
{
<div style="overflow: hidden">
<IgbDataGrid Height="100%" Width="100%"
@ref="@DataGridRef"
RowHeight="50"
DataSource="Employees"
AutoGenerateColumns="false"
IsColumnOptionsEnabled="true"
IsGroupCollapsable="true"
ActivationMode="GridActivationMode.Cell"
SummaryScope="@SummaryScope.Root"
SelectionMode="DataGridSelectionMode.SingleRow">
<IgbImageColumn IsEditable="false" Width="@("*>120")" Field="Photo" HeaderText="写真" PaddingTop="5" PaddingBottom="5" PaddingRight="10"
HorizontalAlignment="@CellContentHorizontalAlignment.Stretch" />
<IgbTextColumn Width="@("*>130")" Field="Name" HeaderText="名前" />
<IgbNumericColumn Width="@("*>130")" Field="Sales"
HorizontalAlignment="@CellContentHorizontalAlignment.Center" HeaderText="売上高" />
<IgbNumericColumn Width="@("*>130")" Field="Salary" PositivePrefix="$"
ShowGroupingSeparator="true"
MaxFractionDigits="0"
MinFractionDigits="0"
HeaderText="給料"/>
<IgbNumericColumn Width="100" Field="Age" HorizontalAlignment="@CellContentHorizontalAlignment.Center" HeaderText="年齢"/>
<IgbDateTimeColumn Width="@("*>140")" Field="Birthday" HeaderText="生年月日" />
<IgbImageColumn IsEditable="false" Width="@("*>110")" Field="CountryFlag" HeaderText="国旗" PaddingTop="5" PaddingBottom="5" PaddingRight="10"
HorizontalAlignment="@CellContentHorizontalAlignment.Stretch" />
<IgbTextColumn Width="@("*>170")" Field="Address" HeaderText="住所"/>
<IgbTextColumn Width="@("*>130")" Field="Phone" HeaderText="電話"/>
<IgbTextColumn Width="@("*>120")" Field="Income" HeaderText="所得"/>
</IgbDataGrid>
</div>
}
</div>
@code {
private List<EmployeeJA> Employees;
private String GridStrings;
private IgbDataGrid _grid;
private IgbDataGrid DataGridRef
{
get { return _grid; }
set { _grid = value; Task.Delay(1).ContinueWith((t) => this.OnDataGridRef()); StateHasChanged(); }
}
protected override void OnInitialized()
{
this.Employees = EmployeeDataJA.Create(100, false);
}
private async Task OnDataGridRef()
{
var countryGroup = new IgbColumnGroupDescription() { Field = "Country", DisplayName = "国" };
var incomeGroup = new IgbColumnGroupDescription() { Field = "Income", DisplayName = "所得" };
this._grid.GroupDescriptions.Add(countryGroup);
this._grid.GroupDescriptions.Add(incomeGroup);
var ageSummary = new IgbColumnSummaryDescription() { Field = "Age", Operand = DataSourceSummaryOperand.Average };
var photoSummary = new IgbColumnSummaryDescription() { Field = "Photo", Operand = DataSourceSummaryOperand.Count };
var salarySummary = new IgbColumnSummaryDescription() { Field = "Salary", Operand = DataSourceSummaryOperand.Sum };
var saleSummary = new IgbColumnSummaryDescription() { Field = "Sales", Operand = DataSourceSummaryOperand.Max };
this._grid.SummaryDescriptions.Add(ageSummary);
this._grid.SummaryDescriptions.Add(photoSummary);
this._grid.SummaryDescriptions.Add(salarySummary);
this._grid.SummaryDescriptions.Add(saleSummary);
//Specific resource strings for Column-Options
await DataGridRef.SetCustomizedStringAsync("en", DataGridResourceStrings());
//Specific resource strings for Summaries
await DataGridRef.ActualDataSource.SetCustomizedStringAsync("en", DataGridResourceStrings());
await DataGridRef.InvalidateVisibleRowsAsync();
}
public string DataGridResourceStrings()
{
GridStrings =
"{\"Apply\":\"適用\"," +
"\"Cancel\":\"キャンセル\"," +
"\"Clear_Column_Filter\":\"列フィルターをクリア\"," +
"\"Column_Move\":\"移動\"," +
"\"Column_Move_Left\":\"左\"," +
"\"Column_Move_Right\":\"右\"," +
"\"Column_Options_Summaries\":\"集計\"," +
"\"Column_Options_Summary_Average\":\"平均\"," +
"\"Column_Options_Summary_Count\":\"カウント\"," +
"\"Column_Options_Summary_Maximum\":\"最大値\"," +
"\"Column_Options_Summary_Minimum\":\"最小値\"," +
"\"Column_Options_Summary_Sum\":\"合計値\"," +
"\"Column_Pin\":\"ピン固定\"," +
"\"Column_Pin_Left\":\"左\"," +
"\"Column_Pin_Right\":\"右\"," +
"\"Column_Sort\":\"ソート\"," +
"\"Column_Sort_Ascending\":\"昇順\"," +
"\"Column_Sort_Descending\":\"降順\"," +
"\"ComparisonOperator_Bottom\":\"下\"," +
"\"ComparisonOperator_BottomPercentile\":\"下位の百分位数\"," +
"\"ComparisonOperator_Contains\":\"~を含む\"," +
"\"ComparisonOperator_DoesNotContain\":\"~を含まない\"," +
"\"ComparisonOperator_DoesNotEndWith\":\"~で終わらない\"," +
"\"ComparisonOperator_DoesNotMatch\":\"~と一致しない\"," +
"\"ComparisonOperator_DoesNotStartWith\":\"~で始まらない\"," +
"\"ComparisonOperator_Empty\":\"空\"," +
"\"ComparisonOperator_EndsWith\":\"次の値で終わる\"," +
"\"ComparisonOperator_Equals\":\"等しい\"," +
"\"ComparisonOperator_False\":\"False\"," +
"\"ComparisonOperator_GreaterThan\":\"次の値より大きい\"," +
"\"ComparisonOperator_GreaterThanOrEqualTo\":\"次の値より大きいまたは等しい\"," +
"\"ComparisonOperator_LastMonth\":\"先月\"," +
"\"ComparisonOperator_LastQuater\":\"前四半期\"," +
"\"ComparisonOperator_LastWeek\":\"先週\"," +
"\"ComparisonOperator_LastYear\":\"昨年\"," +
"\"ComparisonOperator_LessThan\":\"次の値より小さい\"," +
"\"ComparisonOperator_LessThanOrEqualTo\":\"次の値より小さいまたは等しい\"," +
"\"ComparisonOperator_NextMonth\":\"翌月\"," +
"\"ComparisonOperator_NextQuater\":\"翌四半期\"," +
"\"ComparisonOperator_NextWeek\":\"来週\"," +
"\"ComparisonOperator_NextYear\":\"翌年\"," +
"\"ComparisonOperator_NotEmpty\":\"空ではない\"," +
"\"ComparisonOperator_NotEquals\":\"次の値に等しくない\"," +
"\"ComparisonOperator_StartsWith\":\"~で始まる\"," +
"\"ComparisonOperator_ThisMonth\":\"今月\"," +
"\"ComparisonOperator_ThisQuarter\":\"本四半期\"," +
"\"ComparisonOperator_ThisWeek\":\"今週\"," +
"\"ComparisonOperator_ThisYear\":\"今年\"," +
"\"ComparisonOperator_Today\":\"今日\"," +
"\"ComparisonOperator_Tomorrow\":\"明日\"," +
"\"ComparisonOperator_Top\":\"上\"," +
"\"ComparisonOperator_TopPercentile\":\"上位の百分位数\"," +
"\"ComparisonOperator_True\":\"True\"," +
"\"ComparisonOperator_Yesterday\":\"昨日\"," +
"\"Filter_Columns_List\":\"列リストのフィルター...\"," +
"\"Search\":\"検索\"," +
"\"Select_All\":\"(すべて選択)\"," +
"\"DataSource_Summary_Avg\":\"平均\"," +
"\"DataSource_Summary_Count\":\"カウント\"," +
"\"DataSource_Summary_Max\":\"最大値\"," +
"\"DataSource_Summary_Min\":\"最小値\"," +
"\"DataSource_Summary_Sum\":\"合計値\"}";
return GridStrings;
}
}
razor/*
CSS styles are loaded from the shared CSS file located at:
https://static.infragistics.com/xplatform/css/samples/
*/
css
¿Te gusta esta muestra? Obtenga acceso a nuestro kit de herramientas de Ignite UI for Blazor completo y comience a crear sus propias aplicaciones en minutos. Descárgalo gratis.
Cadenas de recursos
Esta es la lista completa de cadenas para localizar la cuadrícula.
Cadenas de opciones de columna
- Apply
- Cancelar
- Clear_Column_Filter
- Column_Move
- Column_Move_Left
- Column_Move_Right
- Column_Pin
- Column_Pin_Left
- Column_Pin_Right
- Column_Sort
- Column_Sort_Ascending
- Column_Sort_Descending
- Filter_Columns_List
- Buscar
- Seleccionar todo
- ComparisonOperator_Bottom
- ComparisonOperator_BottomPercentile
- ComparisonOperator_Contains
- ComparisonOperator_DoesNotContain
- ComparaciónOperator_DoesNotEndWith
- ComparisonOperator_DoesNotMatch
- ComparisonOperator_DoesNotStartWith
- ComparisonOperator_Empty
- ComparaciónOperator_EndsWith
- ComparisonOperator_Equals
- ComparisonOperator_False
- ComparisonOperator_GreaterThan
- ComparisonOperator_GreaterThanOrEqualTo
- ComparisonOperator_LastMonth
- ComparisonOperator_LastQuarter
- ComparisonOperator_LastWeek
- ComparisonOperator_LastYear
- ComparisonOperator_LessThan
- ComparisonOperator_LessThanOrEqualTo
- ComparisonOperator_NextMonth
- ComparisonOperator_NextQuarter
- ComparisonOperator_NextWeek
- ComparisonOperator_NextYear
- ComparisonOperator_NotEmpty
- ComparisonOperator_NotEquals
- ComparisonOperator_StartsWith
- ComparisonOperator_ThisMonth
- ComparisonOperator_ThisQuarter
- ComparisonOperator_ThisWeek
- ComparisonOperator_ThisYear
- ComparisonOperator_Today
- ComparisonOperator_Tomorrow
- ComparisonOperator_Top
- ComparisonOperator_TopPercentile
- ComparisonOperator_True
- ComparisonOperator_Yesterday
- Column_Options_Summary_Average
- Column_Options_Summary_Count
- Column_Options_Summary_Maximum
- Column_Options_Summary_Minimum
- Column_Options_Summary_Sum
- Column_Options_Summaries
Cadenas de resumen
- DataSource_Summary_Avg
- DataSource_Summary_Count
- DataSource_Summary_Max
- DataSource_Summary_Min
- DataSource_Summary_Sum
Referencias de API
ActualDataSource
SetCustomizedStringAsync