# Add floating action button app

**URL:** <https://community.thunkable.com/t/add-floating-action-button-app/75516>\
**Category:** Questions about Thunkable X\
**Tags:** design\
**Created:** [April 29, 2019, 1:44am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516 "2019-04-29T01:44:23Z")\
**Posts on this page:** 19\
**Page:** 1

<div class="post-metadata">

**Author:** ![allinfotec](https://avatars.discourse-cdn.com/v4/letter/a/ebca7d/32.png) [@allinfotec](https://community.thunkable.com/u/allinfotec)\
**Post date:** [April 29, 2019, 1:44am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/1 "2019-04-29T01:44:23Z")

</div>

```
Estou procurando nessa plataforma o floating action button

```

para add no meu app mais so tem button normal!  
tem extensão tipo puravidaapps para importa ? por favor mim ajuda ,

---

<div class="post-metadata">

**Author:** ![Cian\_O\_Sullivan](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/cian_o_sullivan/32/34494_2.png) [@Cian\_O\_Sullivan](https://community.thunkable.com/u/Cian_O_Sullivan)\
**Post date:** [April 29, 2019, 4:35pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/2 "2019-04-29T16:35:31Z")

</div>

Ingles por favor.

Extensions do not work with X platform. If you want extensions then you need to use Classic ([app.thunkable.com](http://app.thunkable.com)) however you do not have iOS compatibility. It is a trade off you need to choose. Platform extensibility or features.

---

<div class="post-metadata">

**Author:** ![allinfotec](https://avatars.discourse-cdn.com/v4/letter/a/ebca7d/32.png) [@allinfotec](https://community.thunkable.com/u/allinfotec)\
**Post date:** [April 30, 2019, 3:17pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/3 "2019-04-30T15:17:33Z")

</div>

sorry ! I’m Brazilian, I speak little in English! I already use the classic and I’m using this for ios, it has like for a float button in the app in thunkable x has like? yes I had I need please give me this tip! Thanks in advance.

---

<div class="post-metadata">

**Author:** ![Cian\_O\_Sullivan](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/cian_o_sullivan/32/34494_2.png) [@Cian\_O\_Sullivan](https://community.thunkable.com/u/Cian_O_Sullivan)\
**Post date:** [April 30, 2019, 3:24pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/4 "2019-04-30T15:24:50Z")

</div>

X does not have a Floating Action button

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [April 30, 2019, 6:00pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/5 "2019-04-30T18:00:16Z")

</div>

If you need a button on top of other elements and located in one place, you can see an example of it on the scrButtons screen in the project (this will be a big button with the + symbol.)

[https://x.thunkable.com/projects/5c8e64dfe1aad2f778a4c5ad/project/properties/designer/](https://x.thunkable.com/projects/5c8e64dfe1aad2f778a4c5ad/project/properties/designer/)

---

<div class="post-metadata">

**Author:** ![allinfotec](https://avatars.discourse-cdn.com/v4/letter/a/ebca7d/32.png) [@allinfotec](https://community.thunkable.com/u/allinfotec)\
**Post date:** [April 30, 2019, 6:24pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/6 "2019-04-30T18:24:27Z")

</div>

I noticed that there is no floating button and it has no activity stater, it has another option to replace this function

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [April 30, 2019, 7:10pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/7 "2019-04-30T19:10:01Z")

</div>

Floating buttons in Thunkable X are made by hand. I offer only a template or an idea of ​​how this can be done.

---

<div class="post-metadata">

**Author:** ![allinfotec](https://avatars.discourse-cdn.com/v4/letter/a/ebca7d/32.png) [@allinfotec](https://community.thunkable.com/u/allinfotec)\
**Post date:** [May 4, 2019, 1:41am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/8 "2019-05-04T01:41:54Z")

</div>

Can you help me with how to make a floating button?

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [May 4, 2019, 7:31am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/9 "2019-05-04T07:31:07Z")

</div>

First you need to decide what the button should look like. After that, you need to determine what should happen when you press it. What are your difficulties?

---

<div class="post-metadata">

**Author:** ![marcos\_jk2](https://avatars.discourse-cdn.com/v4/letter/m/e56c9b/32.png) [@marcos\_jk2](https://community.thunkable.com/u/marcos_jk2)\
**Post date:** [May 4, 2019, 11:23pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/10 "2019-05-04T23:23:15Z")

</div>

Olá, eu também estou querendo fazer isso, meu botão apenas set em um endereço http como get, gostaria que ele pudesse ser visto ou na tela de notificações do celular ou na tela de bloqueio ou tela inicial como “widgets”.

---

<div class="post-metadata">

**Author:** ![actech](https://avatars.discourse-cdn.com/v4/letter/a/3d9bf3/32.png) [@actech](https://community.thunkable.com/u/actech)\
**Post date:** [May 5, 2019, 8:33am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/11 "2019-05-05T08:33:52Z")

</div>

Hello,

I’m afraid that the functionality in Thunkable X will not allow you to do this.

---

<div class="post-metadata">

**Author:** ![jane](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jane/32/27575_2.png) [@jane](https://community.thunkable.com/u/jane)\
**Post date:** [May 5, 2019, 3:20pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/12 "2019-05-05T15:20:29Z")

</div>

You can use the ‘open link’ block to accomplish the function of the Activity Starter.  
[Here’s](http://community.thunkable.com/t/deep-linking-with-open-link-activity-starter-function/75652?u=jane) a post about it.

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [May 6, 2019, 12:16am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/13 "2019-05-06T00:16:46Z")

</div>

@allinfotec, and you can check out the sample app “FABulous” for an example of how to create your own FAB:

> [@FAB (Floating Action Button) for Thunkable ✕](http://community.thunkable.com/t/fab-floating-action-button-for-thunkable/63780):
>
> Hey Thunkers, While there is no official FAB component for Thunkable ✕, you can create one with a few tricks. Here’s a [sample project called FABulous](https://x.thunkable.com/projectPage/5c339e5b08b6b44ebe31bdda) that showcases a FAB using the absolute position property in a Row component. These are properties that are used in ReactNative, which forms the basis for Thunkable ✕. The app also uses the Android / iOS device block to open the App Store if the device is on iOS and Play Store if the device is on Android. Happy Thun…

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [January 28, 2020, 10:55pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/14 "2020-01-28T22:55:30Z")

</div>

Hey all! I am trying to implement this on a scrollable page but am running into issues. As a note, this does work fine when using a non scrollable page or when using a webviewer that has scrollable content.

Does anyone have experience using this on a screen that has scrollable content, such as a listviewer with many items?

as a note, i did follow the instructions for a FAB from the tutorial above but it doesn’t work on a scrollable screen. Only over a web viewer for which the screen doesn’t scroll but the webviewere itself

---

<div class="post-metadata">

**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\
**Post date:** [August 13, 2020, 8:48pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/15 "2020-08-13T20:48:50Z")

</div>

Hi @jared! I´m trying to build a footer with buttons. Scrollable page too. You got it?

---

<div class="post-metadata">

**Author:** ![Deluxe](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/deluxe/32/30016_2.png) [@Deluxe](https://community.thunkable.com/u/Deluxe)\
**Post date:** [August 13, 2020, 11:22pm UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/16 "2020-08-13T23:22:19Z")

</div>

It is totally doable even on scrolling screens. Create the button right under the screen component and set its positioning to absolute. I will let you experiment with the rest 😉

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [August 14, 2020, 1:31am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/17 "2020-08-14T01:31:26Z")

</div>

See an example here

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/9/09226ad9035c913ad07f599fd027f9937a571cee.jpeg)

[https://x.thunkable.com/copy/5ff791d276c049135b2851765d65e0ef](https://x.thunkable.com/copy/5ff791d276c049135b2851765d65e0ef)

---

<div class="post-metadata">

**Author:** ![caminostudio](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/caminostudio/32/74734_2.png) [@caminostudio](https://community.thunkable.com/u/caminostudio)\
**Post date:** [August 14, 2020, 11:49am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/18 "2020-08-14T11:49:04Z")

</div>

Thanks! I learned to use EdgeOffsets with your example.

---

<div class="post-metadata">

**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\
**Post date:** [November 8, 2024, 11:41am UTC](https://community.thunkable.com/t/add-floating-action-button-app/75516/19 "2024-11-08T11:41:22Z")

</div>


