isa/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

appDisplay: Add carousel arrows to app grid

Browse Source 
These only show during navigation (not DnD), along with the
previewed page.

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1630>
This commit is contained in:
Carlos Garnacho
2021-02-13 19:54:14 +01:00
committed by Marge Bot
parent c15dce242e
commit ffe11e0560
5 changed files with 137 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
js/ui/appDisplay.js
View File

@ -211,6 +211,31 @@ var BaseAppView = GObject.registerClass({
y_align: Clutter.ActorAlign.FILL,
});
// Next/prev page arrows
const rtl = this.get_text_direction() === Clutter.TextDirection.RTL;
this._nextPageArrow = new St.Icon({
style_class: 'page-navigation-arrow',
icon_name: rtl
? 'carousel-arrow-back-24-symbolic'
: 'carousel-arrow-next-24-symbolic',
opacity: 0,
reactive: false,
visible: false,
x_expand: true,
x_align: Clutter.ActorAlign.END,
});
this._prevPageArrow = new St.Icon({
style_class: 'page-navigation-arrow',
icon_name: rtl
? 'carousel-arrow-next-24-symbolic'
: 'carousel-arrow-back-24-symbolic',
opacity: 0,
reactive: false,
visible: false,
x_expand: true,
x_align: Clutter.ActorAlign.START,
});
const scrollContainer = new St.Widget({
layout_manager: new Clutter.BinLayout(),
clip_to_allocation: true,
@ -219,6 +244,8 @@ var BaseAppView = GObject.registerClass({
scrollContainer.add_child(this._prevPageIndicator);
scrollContainer.add_child(this._nextPageIndicator);
scrollContainer.add_child(this._scrollView);
scrollContainer.add_child(this._nextPageArrow);
scrollContainer.add_child(this._prevPageArrow);
this._box = new St.BoxLayout({
vertical: true,
@ -990,6 +1017,7 @@ var BaseAppView = GObject.registerClass({
_syncPageHints(pageNumber, animate = true) {
const showingNextPage = this._pagesShown & SidePages.NEXT;
const showingPrevPage = this._pagesShown & SidePages.PREVIOUS;
const dnd = this._pagesShown & SidePages.DND;
const duration = animate ? PAGE_INDICATOR_FADE_TIME : 0;
if (showingPrevPage) {
@ -999,6 +1027,14 @@ var BaseAppView = GObject.registerClass({
opacity,
duration,
});
if (!dnd) {
this._prevPageArrow.visible = true;
this._prevPageArrow.ease({
opacity,
duration,
});
}
}
if (showingNextPage) {
@ -1008,6 +1044,14 @@ var BaseAppView = GObject.registerClass({
opacity,
duration,
});
if (!dnd) {
this._nextPageArrow.visible = true;
this._nextPageArrow.ease({
opacity,
duration,
});
}
}
}
@ -1076,6 +1120,17 @@ var BaseAppView = GObject.registerClass({
if (hasFollowingPage) {
const items = this._grid.getItemsAtPage(nextPage);
items.forEach(item => (item.translation_x = translationX));
if (!(state & SidePages.DND)) {
const pageArrow = page > 0
? this._nextPageArrow
: this._prevPageArrow;
pageArrow.set({
visible: true,
opacity: adjustment.value * 255,
translationX,
});
}
}
if (hasFollowingPage ||
(page > 0 &&
@ -1141,6 +1196,7 @@ var BaseAppView = GObject.registerClass({
onComplete: () => {
this._teardownPagePreview(1);
this._syncClip();
this._nextPageArrow.visible = false;
this._nextPageIndicator.visible = false;
this._updateFadeForNavigation();
},
@ -1163,6 +1219,7 @@ var BaseAppView = GObject.registerClass({
onComplete: () => {
this._teardownPagePreview(-1);
this._syncClip();
this._prevPageArrow.visible = false;
this._prevPageIndicator.visible = false;
this._updateFadeForNavigation();
},