How to show a portion of next screen in previous one in react -navigation?












1














I am creating tabs in my app using react-navigation by createTabNavigator.
What I want to do is how can I show a portion of next screen in tab in the current screen. The Idea is to show the user that there exist another view
This is what I want to achieve
What I have already done is that everything except the for showing the next screen in current one, is there any prop or option that will allow me to shrink down the page container?










share|improve this question



























    1














    I am creating tabs in my app using react-navigation by createTabNavigator.
    What I want to do is how can I show a portion of next screen in tab in the current screen. The Idea is to show the user that there exist another view
    This is what I want to achieve
    What I have already done is that everything except the for showing the next screen in current one, is there any prop or option that will allow me to shrink down the page container?










    share|improve this question

























      1












      1








      1







      I am creating tabs in my app using react-navigation by createTabNavigator.
      What I want to do is how can I show a portion of next screen in tab in the current screen. The Idea is to show the user that there exist another view
      This is what I want to achieve
      What I have already done is that everything except the for showing the next screen in current one, is there any prop or option that will allow me to shrink down the page container?










      share|improve this question













      I am creating tabs in my app using react-navigation by createTabNavigator.
      What I want to do is how can I show a portion of next screen in tab in the current screen. The Idea is to show the user that there exist another view
      This is what I want to achieve
      What I have already done is that everything except the for showing the next screen in current one, is there any prop or option that will allow me to shrink down the page container?







      react-native react-navigation






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 12 at 10:54









      Ammar Tariq

      978




      978
























          1 Answer
          1






          active

          oldest

          votes


















          1














          This is not possible with react-navigation.

          Try using a carousel library like react-native-snap-carousel (https://github.com/archriss/react-native-snap-carousel). As you can see in their showcase apps, this library does exactly what you want.






          share|improve this answer





















          • I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
            – Ammar Tariq
            Nov 12 at 15:40













          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














          draft saved

          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53260632%2fhow-to-show-a-portion-of-next-screen-in-previous-one-in-react-navigation%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown

























          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes









          1














          This is not possible with react-navigation.

          Try using a carousel library like react-native-snap-carousel (https://github.com/archriss/react-native-snap-carousel). As you can see in their showcase apps, this library does exactly what you want.






          share|improve this answer





















          • I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
            – Ammar Tariq
            Nov 12 at 15:40


















          1














          This is not possible with react-navigation.

          Try using a carousel library like react-native-snap-carousel (https://github.com/archriss/react-native-snap-carousel). As you can see in their showcase apps, this library does exactly what you want.






          share|improve this answer





















          • I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
            – Ammar Tariq
            Nov 12 at 15:40
















          1












          1








          1






          This is not possible with react-navigation.

          Try using a carousel library like react-native-snap-carousel (https://github.com/archriss/react-native-snap-carousel). As you can see in their showcase apps, this library does exactly what you want.






          share|improve this answer












          This is not possible with react-navigation.

          Try using a carousel library like react-native-snap-carousel (https://github.com/archriss/react-native-snap-carousel). As you can see in their showcase apps, this library does exactly what you want.







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 12 at 14:02









          brkn

          43628




          43628












          • I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
            – Ammar Tariq
            Nov 12 at 15:40




















          • I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
            – Ammar Tariq
            Nov 12 at 15:40


















          I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
          – Ammar Tariq
          Nov 12 at 15:40






          I have tried it, but the problem was with callbacks they were not properly called Thanks anyway :)
          – Ammar Tariq
          Nov 12 at 15:40




















          draft saved

          draft discarded




















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.





          Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


          Please pay close attention to the following guidance:


          • Please be sure to answer the question. Provide details and share your research!

          But avoid



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53260632%2fhow-to-show-a-portion-of-next-screen-in-previous-one-in-react-navigation%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          Florida Star v. B. J. F.

          Danny Elfman

          Lugert, Oklahoma