Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

table line not showing #340

Closed
TMuhammed opened this issue Jun 26, 2020 · 8 comments
Closed

table line not showing #340

TMuhammed opened this issue Jun 26, 2020 · 8 comments

Comments

@TMuhammed
Copy link

I have a problem with the table line is not visible please help here is my code

import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_html/html_parser.dart';
import 'package:flutter_html/style.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.deepPurple,
      ),
      home: new MyHomePage(title: 'flutter_html Example'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

const htmlData = """
<p style="text-align:center"><strong>&ldquo;AGRODRIP&rdquo;&nbsp; корхонаси ишлаб чиқараётган маҳсулотлар</strong></p>

<p style="text-align:center">&nbsp;</p>

<table border="1" cellspacing="0" class="-11" style="border-collapse:collapse; border:solid windowtext 1.0pt; margin-left:5.4pt; width:100%">
	<thead>
		<tr>
			<td style="height:37.35pt; width:205.55pt">
			<p style="margin-left:0cm; margin-right:0cm; text-align:center"><span style="font-size:11pt"><span style="font-family:Calibri,sans-serif"><span style="font-size:14.0pt">Маҳсулот номи</span></span></span></p>
			</td>
			<td style="height:37.35pt; width:163.05pt">
			<p style="margin-left:0cm; margin-right:0cm; text-align:center"><span style="font-size:11pt"><span style="font-family:Calibri,sans-serif"><span style="font-size:14.0pt">Ўлчов бирлиги</span></span></span></p>
			</td>
			<td style="height:37.35pt; width:99.25pt">
			<p style="margin-left:0cm; margin-right:0cm; text-align:center"><span style="font-size:11pt"><span style="font-family:Calibri,sans-serif"><span style="font-size:14.0pt">Нархи,</span></span></span></p>

			<p style="margin-left:0cm; margin-right:0cm; text-align:center"><span style="font-size:11pt"><span style="font-family:Calibri,sans-serif"><span style="font-size:14.0pt">сўм</span></span></span></p>
			</td>
		</tr>
	</thead>
</table>

<p style="text-align:center"><img alt="" src="https://nwrmp.uz/tomchi/uploads/korxonalar/ishlab_chiqaruvchi/debyut/debyutex1.jpg" style="height:194px; width:259px" /></p>

""";

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text('flutter_html Example'),
        centerTitle: true,
      ),
      body: SingleChildScrollView(
        child: Html(
          data: htmlData,
          //Optional parameters:
          style: {
            "html": Style(
              backgroundColor: Colors.black12,
//              color: Colors.white,
            ),
//            "h1": Style(
//              textAlign: TextAlign.center,
//            ),
            "table": Style(
              backgroundColor: Color.fromARGB(0x50, 0xee, 0xee, 0xee),
            ),
            "tr": Style(
              border: Border(bottom: BorderSide(color: Colors.grey)),
            ),
            "th": Style(
              padding: EdgeInsets.all(6),
              backgroundColor: Colors.grey,
            ),
            ""
            "td": Style(
              padding: EdgeInsets.all(6),
            ),
            "var": Style(fontFamily: 'serif'),
          },
//          customRender: {
//            "flutter": (RenderContext context, Widget child, attributes, _) {
//              return FlutterLogo(
//                style: (attributes['horizontal'] != null)
//                    ? FlutterLogoStyle.horizontal
//                    : FlutterLogoStyle.markOnly,
//                textColor: context.style.color,
//                size: context.style.fontSize.size * 5,
//              );
//            },
//          },
          onLinkTap: (url) {
            print("Opening $url...");
          },
          onImageTap: (src) {
            print(src);
          },
          onImageError: (exception, stackTrace) {
            print(exception);
          },
        ),
      ),
    );
  }
}
@V-ivek
Copy link

V-ivek commented Aug 3, 2020

I also have similar issues from table lines are not showing, any solutions yet?

@heqikang
Copy link

me too

@erickok
Copy link
Collaborator

erickok commented Nov 24, 2020

I see you have in your table

style="border-collapse:collapse; border:solid windowtext 1.0pt; margin-left:5.4pt; width:100%"

I don't think we support these css styles at all yet, but I'd have to check. You can - if that suits you use-case - using style to apply a border around your tds.

@heqikang
Copy link

I see you have in your table

style="border-collapse:collapse; border:solid windowtext 1.0pt; margin-left:5.4pt; width:100%"

I don't think we support these css styles at all yet, but I'd have to check. You can - if that suits you use-case - using style to apply a border around your tds.

set style with td&tr
1111
2222

@heqikang
Copy link

any solutions yet?

@heqikang
Copy link

I see you have in your table

style="border-collapse:collapse; border:solid windowtext 1.0pt; margin-left:5.4pt; width:100%"

I don't think we support these css styles at all yet, but I'd have to check. You can - if that suits you use-case - using style to apply a border around your tds.

set style with td&tr,but the border line misalignment

@heqikang
Copy link

I see you have in your table

style="border-collapse:collapse; border:solid windowtext 1.0pt; margin-left:5.4pt; width:100%"

I don't think we support these css styles at all yet, but I'd have to check. You can - if that suits you use-case - using style to apply a border around your tds.

any solutions yet?

@erickok
Copy link
Collaborator

erickok commented Feb 8, 2021

Should be fixed in #488 (please use our master branch to check and let us know if there is any issue still).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants