He habilitado la configuración de localización y globalización y necesitan agregar el modo RTL en el cultivo RTL. ¿Cómo puedo hacerlo?

Uso de ASP.NET Core 2.2 con páginas de afeitar y configuración de cuenta individual

// Configuration Of Localizaion
            services.AddLocalization(opts =>
            {
                opts.ResourcesPath = "CultureResources";
            });

            //services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);

            services.AddMvc()
                    .AddViewLocalization(opts => { opts.ResourcesPath = "CultureResources"; })
                    .AddViewLocalization(LanguageViewLocationExpanderFormat.Suffix)
                    .AddDataAnnotationsLocalization()
                .SetCompatibilityVersion(CompatibilityVersion.Version_2_1)
            .AddRazorPagesOptions(options =>
            {
                options.AllowAreas = true;
                options.Conventions.AuthorizeAreaFolder("Identity", "/Account/Manage");
                options.Conventions.AuthorizeAreaPage("Identity", "/Account/Logout");
            });

            services.Configure<RequestLocalizationOptions>(opt =>
            {
                var supportedCulutures = new List<CultureInfo>
                {
                    new CultureInfo("en"),
                    new CultureInfo("en-US"),
                    new CultureInfo("ar-EG")
                };

                opt.DefaultRequestCulture = new RequestCulture("en-US");
                // Formating numbers, date, etc.
                opt.SupportedCultures = supportedCulutures;
                // UI strings that we have localized 
                opt.SupportedUICultures = supportedCulutures;
            });

Modo RTL habilitado cuando elige la cultura RTL

2
Muhammad M. Fadel 14 jul. 2019 a las 00:03

2 respuestas

La mejor respuesta

Crea un nuevo archivo CSS para estilos RTL, por ejemplo. rtl.css

body {
    direction:rtl;
}

Luego, en el archivo _layout.cshtml, verifique la dirección de texto de cultivo actual e incluye el archivo CSS relevante en la sección de la cabeza;

@using System.Globalization
@if(CultureInfo.CurrentCulture.TextInfo.IsRightToLeft) {
    <link rel="stylesheet" type="text/css" href="rtl.css">
}
6
LazZiya 13 jul. 2019 a las 21:52

Para .NET CORE 5.0

Puede usar bootstrap-rtl.css y agregar lang = "ar" y dir = "rtl" a la etiqueta HTML. Como <html lang="ar" dir="rtl">

Por lo tanto, para hacerlo dinámico y trabajar con LTR agregue el siguiente código a _layout.cshtml

@{
var culture = Context.Features.Get<Microsoft.AspNetCore.Localization.IRequestCultureFeature>();
var dir = culture.RequestCulture.UICulture.TextInfo.IsRightToLeft ? "rtl" : "ltr";
var twoLetter = culture.RequestCulture.UICulture.TwoLetterISOLanguageName;
}


 <!DOCTYPE html>
<html lang="@twoLetter" dir="@dir">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"]</title>

    <link href="~/lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
    @if (dir == "rtl")
    {
    <link href="~/lib/bootstrap-rtl/css/bootstrap-rtl.css" rel="stylesheet" />
    }

Más información https://getbootstrap.com/docs/5.0/getting-started/rtl /

0
Mohamed Elamin 15 abr. 2021 a las 22:55