本技術(shù)涉及計(jì)算機(jī)視覺，尤其涉及一種卡片顯示方法及相關(guān)裝置。

背景技術(shù)：

1、隨著通訊技術(shù)的不斷發(fā)展，電子設(shè)備(例如智能手機(jī))越來越大眾化、多樣化，對(duì)于電子設(shè)備與用戶進(jìn)行交互的人機(jī)交互界面，其可用性與友好性越來越受到關(guān)注。

2、目前，電子設(shè)備可以在桌面、負(fù)一屏等界面上添加卡片(card)形式的工具組件(widgets)，簡(jiǎn)稱，卡片。電子設(shè)備還可以將多個(gè)卡片堆疊在一起，形成卡片堆。但是，當(dāng)前觸發(fā)查看卡片堆中多個(gè)卡片的操作步驟比較繁瑣。

技術(shù)實(shí)現(xiàn)思路

1、本技術(shù)提供了一種卡片顯示方法及相關(guān)裝置，可以實(shí)現(xiàn)讓用戶可以通過滑動(dòng)操作實(shí)現(xiàn)卡片堆的多種展示效果，簡(jiǎn)化了對(duì)卡片堆的操作復(fù)雜度。

2、第一方面，本技術(shù)提供了一種卡片顯示方法，包括：顯示第一界面，該第一界面包括卡片堆，該卡片堆所在區(qū)域顯示有第一卡片；接收用戶從該卡片堆所在區(qū)域開始的第一滑動(dòng)操作；該第一滑動(dòng)操作在第一方向上的滑動(dòng)距離未達(dá)到第一距離閾值的情況下，在該卡片堆所在區(qū)域顯示該第一卡片的部分和第二卡片的部分；該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離達(dá)到或超過該第一距離閾值且未達(dá)到第二距離閾值的情況下，在該卡片堆所在區(qū)域顯示該第一卡片的部分、第二卡片的部分和該第三卡片的部分；其中，該第一距離閾值小于該第二距離閾值；當(dāng)該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離達(dá)到或超過該第二距離閾值時(shí)，顯示第二界面，該第二界面包括該第一卡片的全部、該第二卡片的全部和該第三卡片的全部。

3、通過本技術(shù)提供的一種卡片顯示方法，電子設(shè)備在顯示出包括有卡片堆的界面時(shí)，可以接收用戶在卡片堆上的向第一方向滑動(dòng)的第一滑動(dòng)操作，電子設(shè)備可以根據(jù)第一滑動(dòng)操作的滑動(dòng)距離，確定并顯示出卡片堆的展示效果。這樣，可以讓用戶可以通過滑動(dòng)操作實(shí)現(xiàn)卡片堆的多種展示效果，簡(jiǎn)化了對(duì)卡片堆的操作復(fù)雜度。

4、在一種可能的實(shí)現(xiàn)方式中，卡片堆的卡片隊(duì)列中包括按照預(yù)設(shè)順序排列的第1個(gè)卡片至第n個(gè)卡片，該第一卡片為該卡片隊(duì)列中的第1個(gè)卡片，1＜p<(n-1)；在顯示該第一界面時(shí)，該方法還包括：在該卡片堆所在區(qū)域從頂層至底層依次布局該卡片隊(duì)列中第1個(gè)卡片至第p個(gè)卡片，以及第n個(gè)卡片。

5、這樣，可以只用在卡片堆上布局p+1層卡片，而不用將卡片隊(duì)列中的n個(gè)卡片全部布局在卡片堆上，在保證卡片堆上滑動(dòng)顯示效果的同時(shí)，可以減少電子設(shè)備繪制卡片堆的復(fù)雜度，節(jié)省了電子設(shè)備的處理資源。

6、在一種可能的實(shí)現(xiàn)方式中，卡片堆的卡片隊(duì)列中包括按照預(yù)設(shè)順序排列的第1個(gè)卡片至第n個(gè)卡片，該第一卡片為該卡片隊(duì)列中的第1個(gè)卡片，1＜n-1≤p；該方法還包括：在該卡片堆所在區(qū)域從頂層至底層依次布局該卡片隊(duì)列中第1個(gè)至第n個(gè)卡片。

7、在一種可能的實(shí)現(xiàn)方式中，卡片堆的卡片隊(duì)列中包括按照預(yù)設(shè)順序排列的第1個(gè)卡片至第n個(gè)卡片，該第一卡片為該卡片隊(duì)列中的第m個(gè)卡片，1＜m≤n，m+p-1≤n；該方法還包括：在該卡片堆所在區(qū)域從頂層至底層依次布局該卡片隊(duì)列中第m個(gè)卡片至第(m+p-1)個(gè)卡片，以及第(m-1)個(gè)卡片。

8、這樣，可以只用在卡片堆上布局p+1層卡片，而不用將卡片隊(duì)列中的n個(gè)卡片全部布局在卡片堆上，在保證卡片堆上滑動(dòng)顯示效果的同時(shí)，可以減少電子設(shè)備繪制卡片堆的復(fù)雜度，節(jié)省了電子設(shè)備的處理資源。

9、在一種可能的實(shí)現(xiàn)方式中，卡片堆的卡片隊(duì)列中包括按照預(yù)設(shè)順序排列的第1個(gè)卡片至第n個(gè)卡片，該第一卡片為該卡片隊(duì)列中的第m個(gè)卡片，1＜m≤n，m+p-1＞n，1＜p<(n-1)；在顯示該第一界面時(shí)，該方法還包括：在該卡片堆所在區(qū)域從頂層至底層依次布局該卡片隊(duì)列中第m至第n個(gè)卡片、以及第1個(gè)卡片至第(m+p-1-n)個(gè)，以及第(m-1)個(gè)卡片。

10、這樣，可以只用在卡片堆上布局p+1層卡片，而不用將卡片隊(duì)列中的n個(gè)卡片全部布局在卡片堆上，在保證卡片堆上滑動(dòng)顯示效果的同時(shí)，可以減少電子設(shè)備繪制卡片堆的復(fù)雜度，節(jié)省了電子設(shè)備的處理資源。

11、在一種可能的實(shí)現(xiàn)方式中，卡片堆的卡片隊(duì)列中包括按照預(yù)設(shè)順序排列的第1個(gè)卡片至第n個(gè)卡片，該第一卡片為該卡片隊(duì)列中的第m個(gè)卡片，1＜m≤n，m+p-1＞n，1＜n-1≤p；在顯示該第一界面時(shí)，該方法還包括：在該卡片堆所在區(qū)域從頂層至底層依次布局該卡片隊(duì)列中第m至第n個(gè)卡片、以及第1個(gè)卡片至第(m-1)個(gè)卡片。

12、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：在該卡片堆所在區(qū)域從頂層至底層依次布局多個(gè)卡片時(shí)，將該第一卡片設(shè)置為完全不透明，將該卡片堆所在區(qū)域布局的剩余卡片設(shè)置為完全透明，該剩余卡片不包括該第一卡片。

13、這樣，在第一卡片在頂層時(shí)，將第一卡片的透明度設(shè)置完全不透明，將處于第一卡片底層的卡片設(shè)置成完全透明，可以不影響卡片堆的顯示出頂層的第一卡片時(shí)的效果。

14、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：若該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離未達(dá)到第三距離閾值時(shí)結(jié)束，在該卡片堆所在區(qū)域顯示該第一卡片的全部，該第三距離閾值小于該第一距離閾值。

15、這樣，可以防止用戶誤觸而改變卡片堆上卡片的顯示情況。

16、在一種可能的實(shí)現(xiàn)方式中，該若該滑動(dòng)操作在該第一方向上的滑動(dòng)距離小于第三距離閾值時(shí)結(jié)束，在該卡片堆所在區(qū)域顯示該第一卡片的全部，具體包括：若該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離未達(dá)到該第三距離閾值時(shí)結(jié)束，該第一卡片在該卡片堆所在區(qū)域沿該第一方向的反方向回彈至在該卡片堆所在區(qū)域顯示該第一卡片的全部。

17、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：若該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離達(dá)到或超過第三距離閾值且未達(dá)到該第二距離閾值時(shí)結(jié)束，在該卡片堆所在區(qū)域顯示該第二卡片的全部，該第三距離閾值小于該第一距離閾值。

18、這樣，可以通過第一滑動(dòng)操作觸發(fā)卡片堆切換頂層顯示的卡片。

19、在一種可能的實(shí)現(xiàn)方式中，該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離未達(dá)到該第一距離閾值的情況下，該第二卡片的部分比該第一卡片的部分更透明；和/或，該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離達(dá)到或超過該第一距離閾值且未達(dá)到該第二距離閾值的情況下，該第二卡片的部分比該第一卡片的部分更透明，該第三卡片的部分比該第二卡片的部分更透明。

20、這樣，可以通過卡片的透明度的不同，體現(xiàn)堆疊的多個(gè)卡片之間的層級(jí)關(guān)系。

21、在一種可能的實(shí)現(xiàn)方式中，該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離未達(dá)到該第一距離閾值的情況下，隨著該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離增加，該卡片堆所在區(qū)域顯示的該第一卡片的部分逐漸減少，該卡片堆所在區(qū)域顯示的該第二卡片的部分逐漸增多；和/或，該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離達(dá)到或超過該第一距離閾值且未達(dá)到該第二距離閾值的過情況下，隨著該第一滑動(dòng)操作在該第一方向上的滑動(dòng)距離增加，該卡片堆所在區(qū)域顯示的該第一卡片的部分逐漸減少，該卡片堆所在區(qū)域顯示的該第二卡片的部分逐漸增多，該卡片堆所在區(qū)域顯示的該第三卡片的部分逐漸增多或不變。

22、在一種可能的實(shí)現(xiàn)方式中，該第二界面中，該第一卡片的顯示區(qū)域位于該第二卡片的顯示區(qū)域的該第一方向上，該第二卡片的顯示區(qū)域位于該第三卡片的該第一方向上。

23、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：在顯示該第一界面時(shí)，接收用戶從該卡片堆所在區(qū)域開始的第二滑動(dòng)操作；該第二滑動(dòng)操作在第二方向上的滑動(dòng)距離未達(dá)到第四距離閾值的情況下，在該卡片堆所在區(qū)域顯示該第四卡片的部分和第一卡片的部分；其中，該第二方向與該第一方向相反；該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離達(dá)到或超過該第四距離閾值且未達(dá)到第五距離閾值的過程中，在該卡片堆所在區(qū)域顯示該第四卡片的部分、該第一卡片的部分和該第二卡片的部分；其中，該第四距離閾值小于該第五距離閾值；當(dāng)在該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離達(dá)到或超過該第五距離閾值時(shí)，顯示第三界面，該第三界面包括該第四卡片的全部、該第一卡片的全部和該第二卡片的全部。

24、這樣，電子設(shè)備在顯示出包括有卡片堆的界面時(shí)，可以接收用戶在卡片堆上的向第二方向滑動(dòng)的第二滑動(dòng)操作，電子設(shè)備可以根據(jù)第二滑動(dòng)操作的滑動(dòng)距離，確定并顯示出卡片堆的展示效果。這樣，可以讓用戶可以通過滑動(dòng)操作實(shí)現(xiàn)卡片堆的多種展示效果，簡(jiǎn)化了對(duì)卡片堆的操作復(fù)雜度。

25、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：當(dāng)該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離達(dá)到該第四距離閾值時(shí)，在該卡片堆所在區(qū)域顯示該第四卡片的全部。

26、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：若該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離未達(dá)到第六距離閾值時(shí)結(jié)束，在該卡片堆所在區(qū)域顯示該第一卡片的全部，該第六距離閾值小于該第四距離閾值。

27、這樣，可以防止用戶誤觸而改變卡片堆上卡片的顯示情況。

28、在一種可能的實(shí)現(xiàn)方式中，該若該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離小于第六距離閾值時(shí)結(jié)束，在該卡片堆所在區(qū)域顯示該第一卡片的全部，具體包括：若該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離未達(dá)到該第六距離閾值時(shí)結(jié)束，該第四卡片在該卡片堆所在區(qū)域沿該第一方向回彈至在該卡片堆所在區(qū)域顯示該第一卡片的全部。

29、在一種可能的實(shí)現(xiàn)方式中，該方法還包括：若該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離達(dá)到或超過在第六距離閾值且未達(dá)到該第五距離閾值之間時(shí)結(jié)束，在該卡片堆所在區(qū)域顯示該第四卡片的全部，該第六距離閾值小于該第一距離閾值。

30、這樣，可以通過第一滑動(dòng)操作觸發(fā)卡片堆切換頂層顯示的卡片。

31、在一種可能的實(shí)現(xiàn)方式中，該第二滑動(dòng)操作在第二方向上的滑動(dòng)距離未達(dá)到該第四距離閾值的情況下，該第一卡片的部分比該第四卡片的部分更透明；和/或，該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離達(dá)到或超過該第四距離閾值且未達(dá)到第五距離閾值的情況下，該第一卡片的部分比該第四卡片的部分更透明，該第二卡片的部分比該第一卡片的部分更透明。

32、這樣，可以通過卡片的透明度的不同，體現(xiàn)堆疊的多個(gè)卡片之間的層級(jí)關(guān)系。

33、在一種可能的實(shí)現(xiàn)方式中，該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離未達(dá)到該第四距離閾值的情況下，隨著該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離增加，該卡片堆所在區(qū)域顯示的該第四卡片的部分逐漸增多，該卡片堆所在區(qū)域顯示的該第一卡片的部分逐漸減少；和/或，該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離達(dá)到或超過該第四距離閾值且未達(dá)到第五距離閾值的情況下，隨著該第二滑動(dòng)操作在該第二方向上的滑動(dòng)距離增加，該卡片堆所在區(qū)域顯示的該第四卡片的部分逐漸減少，該卡片堆所在區(qū)域顯示的該第一卡片的部分逐漸減少，該卡片所在區(qū)域顯示的該第二卡片的部分逐漸增多或不變。

34、在一種可能的實(shí)現(xiàn)方式中，該第三界面中，該第四卡片的顯示區(qū)域位于該第一卡片的顯示區(qū)域的該第一方向上，該第一卡片的顯示區(qū)域位于該第二卡片的該第一方向上。

35、第二方面，本技術(shù)提供了一種電子設(shè)備，包括顯示屏、一個(gè)或多個(gè)處理器和一個(gè)或多個(gè)存儲(chǔ)器；其中，該顯示屏、該一個(gè)或多個(gè)存儲(chǔ)器與該一個(gè)或多個(gè)處理器耦合，該一個(gè)或多個(gè)存儲(chǔ)器用于存儲(chǔ)計(jì)算機(jī)程序代碼，該計(jì)算機(jī)程序代碼包括計(jì)算機(jī)指令，當(dāng)該一個(gè)或多個(gè)處理器執(zhí)行該計(jì)算機(jī)指令時(shí)，使得執(zhí)行上述第一方面中任一項(xiàng)可能的實(shí)現(xiàn)方式中的方法。

36、第三方面，本技術(shù)提供了另一種電子設(shè)備，包括一個(gè)或多個(gè)功能模塊，該一個(gè)或多個(gè)功能模塊用于執(zhí)行上述第一方面中任一項(xiàng)可能的實(shí)現(xiàn)方式中的方法。

37、第四方面，本技術(shù)提供了一種本技術(shù)提供了一種芯片，應(yīng)用于電子設(shè)備，該芯片包括處理電路和接口電路，該接口電路用于接收指令并傳輸至處理電路，處理電路用于運(yùn)行指令以執(zhí)行上述任一方面任一項(xiàng)可能的實(shí)現(xiàn)方式中的方法。

38、第五方面，本技術(shù)提供了一種計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)，包括指令，其特征在于，當(dāng)該指令在電子設(shè)備上運(yùn)行時(shí)，使得執(zhí)行上述第一方面中任一項(xiàng)可能的實(shí)現(xiàn)方式中的方法。

39、第六方面，本技術(shù)實(shí)施例提供了一種計(jì)算機(jī)程序產(chǎn)品，當(dāng)計(jì)算機(jī)程序產(chǎn)品在計(jì)算機(jī)上運(yùn)行時(shí)，使得計(jì)算機(jī)執(zhí)行上述任一方面任一項(xiàng)可能的實(shí)現(xiàn)方式中的方法。