ASP.NET - Jednotný vzhled stránek

ASP.NET - Jednotný vzhled stránek otázka

29. 10. 2014 7:57

0 2

Zdravím.

Realizoval jsem ASP.NET aplikaci,která je naistalována serveru s Windows. Z mobilního zařízení (Motorola MC9190-G) s Windows CE se tato ASP.aplikace volá a všechny web stránky vypadají dle požadavku zákazníka - vše je dostatečně veliké a funkční. Nyní si zákazník zakoupil STEJNÉ zařízení, ale s Windows Mobile. Funkčnost je zachována, ale ovládací prvky ve web stránkách jsou zřetelně menší a tudíž méně čitelné. Jak lze zajistit, aby u obou hardwarově stejných zařízení ale s různým OS vypadaly web stránky stejně.

Stránka MENU.aspx obsahuje zhruba toto :

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CTECKY.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-t...">

</head>

<body>

.......

<tr>

<asp:Button ID="btnPrijem" runat="server" CssClass="stylButton" Text="Príjem" OnClick="btnPrijem_Click" Width="90%">

</asp:Button>

</td>

</tr>

<tr>

<asp:Button ID="btnVydej" runat="server" CssClass="stylButton" Text="Výdaj" OnClick="btnVydej_Click" Width="90%">

</asp:Button>

</td>

</tr>

.......

</table>

</form>

</body>

</html>

Stylovací sešit Styly.css obsahuje kromě jiného :

.stylForm

{

height: 100%;

width: 100%;

}

.stylTableCentre

{

height: 100%;

width: 100%;

background-color: #dfa894;

text-align: center;

}

.stylButton

{

height: 30px;

font-size: medium;

font-weight: bold;

}

Děkuji a s pozdravem

nahlásit spam

odpovědět

29. 10. 2014 13:20

Jan Holan

4 258

Obecně v HTML platí, že co není nastylováno, na to se použije "nějaký" default. Problém velice často bývá v tom, že každý prohlížeč má tento default jiný a tím se stránky zobrazují rozdílně.

Čekal bych že toto bude i Váš problém u rozdílných mobilních prohlížečů.

Jedna z taktik, jak toto řešit, je použít nějaký dostupný Reset CSS styl soubor, který napřed "vynuluje všechny" základní styly a poté si vše potřebné pro vaše stránky nastavíte ve svém CSS.

nahlásit spam

odpovědět

6. 11. 2014 11:33

Roman Rajnoha

0 2

Tak jsem zjistil, že problém, je v tom že jedno zařízení má Windows CE s rozlišením QVGA a druhé zařízení má Windows Mobile s rozlišením VGA. Takže problém je v rozlišení. Tudíž si myslím, že stačí mít dva styly (např.StylVGA a StylQVA) a pak dle mého stačí napsat externí java skript, který na základě rozlišení zvolí správný styl.

Do hlavičky každé stránky *.aspx jsem napsal toto :

</head>

A pak jsem napsal tento JAVA skript "Styly.js" ale nevím, zda není moc složitý. Bojoval jsem s relativní cestou ke stylům.

//**************************************** Skript pro volbu stylu dle nastaveneho rozliseni ***************************

// VGA = 640 × 480

// QVGA = 320 × 240

var a = window.screen;

var w = a.width;

var h = a.height;

//Urceni realtivni cesty ke stylu

var webLocation = document.location.toString();

var applicationNameIndex = webLocation.indexOf('/', webLocation.indexOf('://') + 3);

var applicationName = webLocation.substring(0, applicationNameIndex) + '/';

var webFolderIndex = webLocation.indexOf('/', webLocation.indexOf(applicationName) + applicationName.length);

var webFolderFullPath = webLocation.substring(0, webFolderIndex);

var webFolderRelativePath = webLocation.substring(applicationNameIndex, webFolderIndex);

//element pro vybrany styl bude ve tvaru <link rel="stylesheet" type="text/css" href=".css"/>

var styleNode = document.createElement('link');

styleNode.setAttribute('rel', 'stylesheet');

styleNode.setAttribute('type', 'text/css');

if (w > "640" & h > "480") {

styleNode.setAttribute('href', webFolderRelativePath+'/StylyVGA.css');

}

else if (w = "640" & h == "480") {

styleNode.setAttribute('href', webFolderRelativePath + '/StylyVGA.css');

}

else if (w < "640" & h < "480") {

styleNode.setAttribute('href', webFolderRelativePath + '/StylyQVGA.css');

}

//alert("Your system resolution is:" + w.toString() + "*" + h.toString() + " - " + styleNode["href"].toString());

//Pridani elementu do "<head> </head>" oddílu html stranky

document.getElementsByTagName('head')[0].appendChild(styleNode);

Nevím ale, zda to je dobrá cesta....

nahlásit spam

odpovědět

DotNETcollege: Mohlo by vás zajímat

TypeScript

Javascript pro mírně pokročilé

Budoucnost ASP.NET, Razor a MVC pro Web Forms programátory

Vývoj webových aplikací v Angular I

DotVVM pro začátečníky

Vývoj single page aplikací pomocí ASP.NET Web API, Knockout JS a Durandal

Upgrade programátorských dovedností

ASP.NET MVC pro mírně pokročilé

DotVVM pro pokročilé

ASP.NET Core (1/5): Co to je a jak to funguje

8. 11. 2014 13:14

Michal Štěpánek

19 291

Pro psaní kódu používejte tlačítko podle jazyka, takhle je to strašně nepřehledné. Ta rozlišení se mohou vyskytovat jen dvě? Co když jich bude víc?

nahlásit spam

odpovědět

otázka připomínka kladné hodnocení záporné hodnocení

Nadpis:

Antispam:

Komu se občas házejí perly?

Příspěvek bude publikován pod identitou anonym.

Administrátoři si vyhrazují právo komentáře upravovat či mazat bez udání důvodu.
Mazány budou zejména komentáře obsahující vulgarity nebo porušující pravidla publikování.

Pokud nejste zaregistrováni, Vaše IP adresa bude zveřejněna. Pokud s tímto nesouhlasíte, příspěvek neodesílejte.

dotNETportal.cz