asp.net中的水平列表视图

本文关键字：列表 视图 水平 net asp | 更新日期: 2023-09-27 18:12:28

这是我的listView和Data Pager的代码，

 <asp:ListView runat="server" ID="PageHorizon">
        <LayoutTemplate>
            <asp:PlaceHolder ID="itemPlaceholder" runat="server">  
            </asp:PlaceHolder>
        </LayoutTemplate>
        <ItemTemplate>
            <table width="100%">
                <tr>
                    <td width="25%">
                            <img src='<%#Eval("ImagePath")%>' alt="Single Image"  
                            width="64px" height="64px" />
                    </td>
                </tr>
            </table>
        </ItemTemplate>
    </asp:ListView>
    <br />
    <hr />
    <asp:DataPager ID="DataPager1" runat="server" PagedControlID="PageHorizon"  
     PageSize="3">
        <Fields>
            <asp:NextPreviousPagerField ShowFirstPageButton="True"   
            ShowNextPageButton="True" />
            <asp:NumericPagerField />
            <asp:NextPreviousPagerField ShowLastPageButton="True"   
            ShowPreviousPageButton="True" />
        </Fields>
    </asp:DataPager>

通过这个代码，listView垂直显示图像，我想水平显示我的图像
如何更改listView的方向？

asp.net中的水平列表视图

如果你只想在一行中显示图像，你可以把它们放在一行的列中。尝试按如下方式重写列表视图标记(将table、tr标记移到LayoutTemplate中(：

<asp:ListView runat="server" ID="PageHorizon">
    <LayoutTemplate>
        <table>
        <tr>
           <asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
        </tr>
        </table>
    </LayoutTemplate>
    <ItemTemplate>  
            <td>
                <img src='<%#Eval("ImagePath")%>' alt="Single Image"  
                width="64px" height="64px" />
            </td>       
    </ItemTemplate>
</asp:ListView>

我用过一次这个代码

<asp:ListView ID="listview1" runat="server">
    <ItemTemplate>
        <table  style="display: inline-block;">
            <tr>
                <td>
                    <asp:Image ID="Image1" runat="server" ImageUrl="<%#Bind('ImageURL') %>" CssClass="max75" />
                </td>
            </tr>
        </table>
    </ItemTemplate>
</asp:ListView>

试试

<ListView.ItemsPanel>
   <ItemsPanelTemplate>
      <StackPanel Orientation="Horizontal" />
   </ItemsPanelTemplate>
</ListView.ItemsPanel>

您可以使用WrapPanel而不是StackPanel。

相关文章：