像Google io 2018 android一样的小吃店

时间:2018-06-28 14:20:03

标签: android android-snackbar googleio material-components-android

如何实现这样的小吃店。要使其具有圆形边缘并在晶圆厂上方显示,并且不会在屏幕的整个宽度上拉伸enter image description here

3 个答案:

答案 0 :(得分:1)

这是Google最近发布的Material Components包的一部分。 可能在:-

com.google.android.material:material:1.0.0-alpha3

尽管它仍然处于alpha状态。因此,我不确定您是否可以在Production中使用它。我将在下面附加一些链接以进行检查。

Material Component Snack Bar

See all components list

Samples

答案 1 :(得分:1)

使用Material Components library中的Snackbar
默认情况下,它具有圆角。
使用setAnchorView方法使Snackbar出现在特定视图上方(对于您来说是fab按钮)。

        Snackbar snackbar = Snackbar.make(view, "...", Snackbar.LENGTH_LONG);
        snackbar.setAnchorView(fab);
        snackbar.show();

您还可以使用应用主题中的 snackbarStyle 属性来自定义边距。

  <style name="AppTheme" parent="Theme.MaterialComponents.Light">
    ....
    <item name="snackbarStyle">@style/MySnackbar</item>
  </style>

在快餐栏样式中,使用 android:layout_margin 属性。

  <style name="MySnackbar" parent="@style/Widget.MaterialComponents.Snackbar">
    <item name="android:layout_margin">32dp</item>
  </style>

enter image description here

答案 2 :(得分:0)

尝试添加此依赖项。

<div class="top-container">
  <h1>NVM Memory Comparision Report</h1>
</div>

<div class="header" id="myHeader">
  <h2>Overall Report Passed</h2>
</div>

<div class="mid-container" style="margin-top: 0px;">
  <h3>General Information</h3>
</div>

<div class="Heading4">Test Setup</div>
<div class="Indentation">
  <table cellpadding="10">
    <tbody>
      <tr>
        <td class="CellNoColor">Report Generation: </td>
        <td class="CellNoColor">Success</td>
      </tr>
      <tr>
        <td class="CellNoColor">File's Root Path: </td>
        <td class="CellNoColor">New XXX Path: XXX</td>
      </tr>
      <tr>
        <td class="CellNoColor">Configuration Comment: </td>
        <td class="CellNoColor">XXX</td>
      </tr>
      <tr>
        <td class="CellNoColor">XXX: </td>
        <td class="CellNoColor">XXX</td>
      </tr>
    </tbody>
  </table>
</div>

<div class="Heading4">Blocks Present in DataConfig</div>

<div class="Heading5">New Version:0042</div>
<div class="Indentation" style="float: none;">
  <table cellpadding="5" width="70%">
    <tbody>
      <tr>
        <th class="TableHeadingCell" width="18%">Dataset Name</th>
        <th class="TableHeadingCell" width="12%" text-align:center;="">SparePart Number</th>
        <th class="TableHeadingCell">Blocks Present</th>
        <th class="TableHeadingCell" width="10%">Result</th>
      </tr>
      <tr>
        <td class="TableHeadingCell">All Datasets</td>
        <td class="DefaultCell" style="t" ext-align:center;="">All Sparepart Numbers</td>
        <td class="DefaultCell"> Blocks 81, 99, 115, 120, 121, 133</td>
        <td class="PositiveResult">Pass</td>
      </tr>
    </tbody>
  </table>
</div>
<div class="Heading5">Old Version:0041</div>
<div class="Indentation" style="float: none;">
  <table cellpadding="5" width="70%">
    <tbody>
      <tr>
        <th class="TableHeadingCell" width="18%">Dataset Name</th>
        <th class="TableHeadingCell" width="12%" text-align:center;="">SparePart Number</th>
        <th class="TableHeadingCell">Blocks Present</th>
        <th class="TableHeadingCell" width="10%">Result</th>
      </tr>
      <tr>
        <td class="TableHeadingCell">All Datasets</td>
        <td class="DefaultCell" style="t" ext-align:center;="">All Sparepart Numbers</td>
        <td class="DefaultCell"> Blocks 81, 99, 115</td>
        <td class="PositiveResult">Pass</td>
      </tr>
    </tbody>
  </table>
</div>






<table cellpadding="5" class="SubHeadingTable">
  <tbody>
    <tr>
      <td>
        <big class="Heading2">Detailed Comparision Between FEE DUMPs</big>
      </td>
    </tr>
  </tbody>
</table>






<div class="Indentation"></div>
<table cellpadding="5" class="TestGroupHeadingBackground">
  <tbody>
    <tr>
      <td>
        <big class="Heading3">XXX</big>
      </td>
    </tr>
  </tbody>
</table>
<div class="Indentation">
  <p>Report is based on data obtained from comparing files XXX and XXX in folder USA.</p>
</div>
<div class="Indentation"></div>
<div class="Indentation">
  <table cellpadding="5" class="ResultTable">
    <tbody>
      <tr>
        <th class="TableHeadingCell" width="4%">Block ID</th>
        <th class="TableHeadingCell" width="4%">Block Address</th>
        <th class="TableHeadingCell" width="10%">Block Name</th>
        <th class="TableHeadingCell" width="10%">Parameter Name</th>
        <th class="TableHeadingCell" width="4%">Size</th>
        <th class="TableHeadingCell" width="auto">Old Data</th>
        <th class="TableHeadingCell" width="auto">New Data</th>
        <th class="TableHeadingCell" width="8%">Result</th>
      </tr>

      <tr>
        <td style="vertical-align: middle;" class="NumberCell">3</td>
        <td style="vertical-align: middle;" class="NumberCell">0x03000100</td>
        <td style="vertical-align: middle;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="NumberCell">4 Bytes</td>
        <td style="vertical-align: middle;font-family: Consolas,Monaco,Lucida Console,Courier New, monospace;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;font-family: Consolas,Monaco,Lucida Console,Courier New, monospace;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="WarningCell">Value Changed</td>
      </tr>
      <tr>
        <td style="vertical-align: middle;" class="NumberCell">5</td>
        <td style="vertical-align: middle;" class="NumberCell">0x03000300</td>
        <td style="vertical-align: middle;" class="DefaultCell">Fbl_Global</td>
        <td style="vertical-align: middle;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="NumberCell">4 Bytes</td>
        <td style="vertical-align: middle;font-family: Consolas,Monaco,Lucida Console,Courier New, monospace;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;font-family: Consolas,Monaco,Lucida Console,Courier New, monospace;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="WarningCell">Value Changed</td>
      </tr>
      <tr>
        <td style="vertical-align: middle;" class="NumberCell">45</td>
        <td style="vertical-align: middle;" class="NumberCell">0x03002F00</td>
        <td style="vertical-align: middle;" class="DefaultCell">ProdData</td>
        <td style="vertical-align: middle;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="NumberCell">5 Bytes</td>
        <td style="vertical-align: middle;font-family: Consolas,Monaco,Lucida Console,Courier New, monospace;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;font-family: Consolas,Monaco,Lucida Console,Courier New, monospace;" class="DefaultCell">XXX</td>
        <td style="vertical-align: middle;" class="WarningCell">Value Changed</td>
      </tr>

    </tbody>
  </table>
</div>

<table cellpadding="5" class="SubHeadingTable">
  <tbody>
    <tr>
      <td>
        <big class="Heading2">End of Report</big>
      </td>
    </tr>
  </tbody>
</table>
<div class="Heading4" style="text-align=right;">Author: XXX</div>

然后可以使用此代码添加Cafe Bar。

implementation 'com.github.danimahardhika:cafebar:1.3.1'

如果您需要更多自定义设置,请访问文档here

enter image description here