maui sqlite开发一个商城加购物车的演示(3)

这篇具有很好参考价值的文章主要介绍了maui sqlite开发一个商城加购物车的演示(3)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

购物车界面及代码

maui sqlite开发一个商城加购物车的演示(3),net 开发,c#,android,visual studio,sqlite文章来源地址https://www.toymoban.com/news/detail-753639.html

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:syncfusion="clr-namespace:Syncfusion.Maui.ListView;assembly=Syncfusion.Maui.ListView"
             x:Class="ShoppingUI.CartPage"
               Shell.NavBarIsVisible="True"
             Title="购物车">
    <ContentPage.Content>
        <Grid RowDefinitions="Auto,*,Auto,Auto,Auto" ColumnDefinitions="*,Auto" RowSpacing="0" BackgroundColor="#2C363C">

            <Grid ColumnDefinitions="*,*" RowDefinitions="Auto,Auto" Grid.ColumnSpan="2" Margin="0,10,10,8" BackgroundColor="#2C363C" HorizontalOptions="FillAndExpand">
                    <Label Text=" 购物车"  HorizontalTextAlignment="Start" FontSize="28" TextColor="White" FontAttributes="Bold"/>
                <StackLayout Grid.Column="1" Grid.Row="1" Orientation="Horizontal" HorizontalOptions="End">
                    <Label  Text="{Binding Path=CartItems.Count}" CharacterSpacing="3" Padding="0,20,0,0" FontSize="15" FontAttributes="Bold" HorizontalTextAlignment="Center" TextColor="White"/>
                    <Label  Text="" Padding="0,20,0,0" FontSize="15" FontAttributes="Bold" HorizontalTextAlignment="Center" TextColor="White"/>
                </StackLayout>
                </Grid>

            <Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" VerticalOptions="Start" BackgroundColor="#2C363C">
                    <syncfusion:SfListView x:Name="listView" ItemSpacing="5,0,0,0" 
                   ItemsSource="{Binding CartItems}"
                               ItemSize="120">

                        <syncfusion:SfListView.ItemTemplate>
                        <DataTemplate>
                            <Grid Margin="0,0,0,8" RowDefinitions="*,*" ColumnDefinitions="100,120,*"  BackgroundColor="#e3ecfa">
                                <Frame HeightRequest="100" WidthRequest="100" HasShadow="False" Grid.RowSpan="2" CornerRadius="10" BackgroundColor="White"  VerticalOptions="CenterAndExpand">
                                    <Image Source="{Binding Picture}"  Aspect="AspectFill" />
                                </Frame>
                                <StackLayout Grid.Row="0" Grid.RowSpan="2" Grid.Column="1" VerticalOptions="Center">
                                    <Label Text="{Binding Name}"  Padding="10,0,0,10" FontSize="17" FontAttributes="Bold" TextColor="#2C363C"/>
                                    <Label  Text="{Binding Price}" Padding="10,0,0,0" FontAttributes="Bold" FontSize="20" TextColor="#2C363C"/>
                                </StackLayout>
                                <StackLayout Orientation="Horizontal" Grid.Row="1" Grid.Column="3" VerticalOptions="Center">
                                <Button  FontSize="15"   BackgroundColor="Transparent" Text="-" TextColor="Black" HorizontalOptions="End" HeightRequest="40" WidthRequest="50" />
                                    <Button  FontSize="13"  Margin="10,0,10,0" BackgroundColor="#2C363C" Text="{Binding Quantity}" TextColor="White" HorizontalOptions="End" HeightRequest="40" WidthRequest="50"/>
                                <Button  FontSize="15"   BackgroundColor="Transparent" Text="+" TextColor="Black" HorizontalOptions="End" HeightRequest="40" WidthRequest="50"  />
                                </StackLayout>
                            </Grid>
                        </DataTemplate>
                        
                        </syncfusion:SfListView.ItemTemplate>
                    </syncfusion:SfListView>
                </Grid>

                <Label Grid.Row="3" Grid.Column="0" TextColor="White" Text="Total Payment" Padding="30,10,30,5" />
            <Label Grid.Row="4" Grid.Column="0" TextColor="White" Text="$99.00" Padding="30,0,30,30" FontAttributes="Bold" FontSize="30"/>
            <Button Grid.Row="3" Grid.RowSpan="2" Grid.Column="1" VerticalOptions="Center" BackgroundColor="White" Text="Checkout" TextColor="#2C363C" CornerRadius="20" Margin="0,10,30,30" WidthRequest="180" FontSize="17" FontAttributes="Bold" HeightRequest="55"/>
        </Grid>
    </ContentPage.Content>
</ContentPage>
namespace ShoppingUI;

public partial class CartPage : ContentPage
{
	public CartPage(ProductPageViewModel productPageViewModel)
	{
		InitializeComponent();
        BindingContext = productPageViewModel;
      
    }
}

到了这里,关于maui sqlite开发一个商城加购物车的演示(3)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序 - 商城项目 - 购物车

      引入 WeUI:

    2023年04月22日
    浏览(47)
  • SpringBoot项目--电脑商城【加入购物车】

    1.使用use命令先选中store数据库 2.在store数据库中创建t_cart用户数据表 在entity包下创建购物车的Cart实体类并使其继承BaseEntity 1.向购物车表中插入商品数据的SQL语句 2.如果当前商品已经在购物车存在,则直接更新商品即可 3.在插入或者更新具体执行哪个语句,取决于数据库中是否

    2024年02月09日
    浏览(60)
  • 实现蛋糕商城购物车功能代码实现实验报告

    一、实验目的 1、熟悉HttpSession接口中常用方法 2、熟悉Session 对象的生命周期 3、熟悉两种方法返回与当前请求相关的HttpSession对象。 4、学会如何使用Session 技术模拟用户登录的功能 二、实验内容 实现购物车 1、在chapler05 项目下新建一个名称为 cn.itcast.session.entity 的包,在该

    2024年02月09日
    浏览(45)
  • 津津乐道设计模式 - 迭代器模式详解(以购物车的场景来演示迭代器模式)

    😄 19年之后由于某些原因断更了三年,23年重新扬帆起航,推出更多优质博文,希望大家多多支持~ 🌷 古之立大事者,不惟有超世之才,亦必有坚忍不拔之志 🎐 个人CSND主页——Micro麦可乐的博客 🐥《Docker实操教程》专栏以最新的Centos版本为基础进行Docker实操教程,入门

    2024年02月16日
    浏览(39)
  • 谷粒商城篇章8 ---- P236-P247 ---- 购物车【分布式高级篇五】

    目录 1 环境搭建 1.1 新建购物车服务模块gulimall-cart 1.2 购物车服务相关配置 1.2.1 pom.xml  1.2.2 yml配置 1.2.2.1 application.yml配置 1.2.2.2 bootstrap.yml配置 1.2.3 主类 1.3 SwitchHosts增加配置 1.4 网关配置 1.5 整合SpringSession 1.5.1 session数据存储在redis 1.5.2 开启SpringSession 1.6 购物车页面搭建 2 购

    2024年02月01日
    浏览(70)
  • 鸿蒙版瑞幸咖啡开发日记(三)购物车结算栏开发

    这里我实现的效果其实和原版的差别不大,只是没有上面的清空购物车 只要在上面的菜单栏中选购了咖啡,这里的图标就会自动展开成购物车 点击后显示具体的购物车咖啡 大家有没有觉得这里还是蛮复杂的,里面有购物车图标、配送费计算、结算栏等等,那我们怎么设计呢

    2024年01月21日
    浏览(87)
  • 使用Vue.js框架的指令和事件绑定实现一个购物车的页面布局

    使用了v-model指令来实现全选/全不选的功能,当全选框被点击时,isAllChecked的值会被改变。 使用了v-if指令来判断购物车中是否有商品,如果有商品则渲染商品列表,否则显示购物车为空的提示。 使用了v-for指令来遍历datalist数组,渲染每个商品项。 使用了@change事件来监听商

    2024年02月12日
    浏览(53)
  • 给你一个购物车模块,你会如何设计测试用例?【测试用例设计】

    测试购物车 从使用场景上,把自己想象成一个使用购物车的人,模拟流程,可以主要从两个方面进行考虑: 涉及操作:增(添加商品)删(删除商品)改(编辑、跳转商品)查(检查金额、数目、优惠明细)+商品支付 涉及交互:购物车与用户登录状态的交互,购物车与商品

    2024年01月24日
    浏览(57)
  • 【java】【项目实战】[外卖八]产品展示、购物车、下单开发

    目录 一、导入用户地址簿相关功能代码 1 需求分析 2 数据模型 3 导入功能代码  3.1 实体AddressBook  3.2 Mapper接口AddressBookMapper   3.3 业务接口层AddressBookService 3.4 业务接口实现类AddressBookServiceImpl 3.5 控制层AddressBookController 4 功能测试 二、菜品展示 1 需求分析 2 代码开发  2.1 m

    2024年02月11日
    浏览(59)
  • 【uniapp 开发小程序】购物车功能,实现全选、反选、单选、计算总价

    uniapp 开发小程序,实现购物车功能,实现全选、反选、单选、计算总价 关键代码: return totalPrice.toFixed(2); // 保留两位小数 否则会出现多位小数现象:

    2024年02月11日
    浏览(35)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包