Windows formでのUI面のデザインがシンプルだったりするため、webBrowserを使ってブタンを表示してみようと思いました。
試しに以下のシンプルなボタンをbtn1.htmlとして、WindowsFormsApplication1.exeと同じフォルダーパスに配置しました。
btn1.htmlの中身は以下のようになっています。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
#btn{
margin: 0px;
width: 180px;
border-radius: 5px;
box-shadow: 0 4px 0 #e91b0c;
background: #f44336;
color:#fff;
cursor: pointer;
padding: 7px;
text-align: center;
}
#btn:hover{
opacity: 0.8;
}
#btn:active{
background: #FFA500 ;
box-shadow: 0 4px 0 #FFB550 ;
width: 150px ;
margin: 5px;
}
</style>
<script type="text/javascript">
</script>
<title>test</title>
</head>
<body>
<div id="btn">button1</div>
</body>
</html>
このbtn1.htmlはIEやChromeで開くとhover、activeはしっかり動いています。
ですが、これをwebBrowserを実装したWinformで動かすと全く動いてくれません(ボタンの描画はできています)。
正確にはCSSが反映されていないのでhoverやactiveが読み込まれないようです。
下記がwinformのソースです。
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
namespace WindowsFormsApplication1
{
public partial class Form1 : Form
{
public Form1( )
{
InitializeComponent( );
}
private void Form1_Load( object sender , EventArgs e )
{
}
private void button1_Click( object sender , EventArgs e )
{
String local ;
String address ;
local = Application.StartupPath ;
address = "file:\\\\" + local + textBox1.Text ;
label1.Text = address ;
webBrowser1.Navigate( new Uri( address ) ) ;
}
public bool IsHorizontalScrollbarPresent( WebBrowser web )
{
try
{
var widthofScrollableArea = web.Document.Body.ScrollRectangle.Width;
var widthofControl = web.Document.Window.Size.Width;
return widthofScrollableArea > widthofControl;
}
catch( Exception ex )
{
return false ;
}
}
private void webBrowser1_DocumentCompleted( object sender , WebBrowserDocumentCompletedEventArgs e )
{
if ( IsHorizontalScrollbarPresent( webBrowser1 ) )
{
webBrowser1.ScrollBarsEnabled = false ;
webBrowser1.Document.Body.Style = "zoom:40%" ;
webBrowser1.Visible = true ;
}
else
{
webBrowser1.Visible = true ;
}
}
}
}
どう修正したらCSSが反映されるようになるのでしょうか。